html中radio值的獲取、賦值、注冊事件示例詳解

字號(hào):


    1,radio分組
    只要name一樣,就是一組的,即一組中只能選擇一個(gè),如下:
    代碼如下:
    <span>group1:</span>
    <inputtype="radio"id="radio1"checked="checked"name="group1"/>radio1
    <inputtype="radio"id="radio2"name="group1"/>radio2
    <inputtype="radio"id="radio3"name="group1"/>radio3
    <span>group2:</span>
    <inputtype="radio"id="radio4"checked="checked"name="group2"/>radio4
    <inputtype="radio"id="radio5"name="group2"/>radio5
    <inputtype="radio"id="radio6"name="group2"/>radio6
    2,獲取選中的radio節(jié)點(diǎn)
    使用jquery可以很方便做到,先選擇group,然后過濾出checked的,如下:
    代碼如下:
    vargroup1=$("[name='group1']").filter(":checked");
    console.log(group1.attr("id"));
    3,選中一個(gè)radio節(jié)點(diǎn)
    使用jquery設(shè)置checked屬性:
    代碼如下:
    $("#radio2").attr("checked","checked");
    4,去選中一個(gè)radio節(jié)點(diǎn)
    移除checked屬性:
    代碼如下:
    $("#radio1").removeAttr("checked");
    這樣做的結(jié)果可能造成一組radio中沒有一個(gè)處于選中狀態(tài)。
    5,注冊選中去選中事件
    還是使用jquery的on函數(shù)來注冊change事件,如下:
    代碼如下:
    $("[name='group1']").on("change",
    function(e){
    console.log($(e.target).val());
    }
    );
    這樣只要group1中任何一個(gè)有選中的,就會(huì)觸發(fā)函數(shù)。