js jquery radio 选中 选中值

 

radio示例:

<label><input type="radio" name="type" id="type" value="year" />年</label>
<label><input type="radio" name="type" id="type" value="month" checked/>月</label>
<label><input type="radio" name="type" id="type" value="date" />日</label><br />

 

js操作

// 获取dom
var arrObj = document.getElementsByName("type");

 

一,获取

// 获取radio数量
console.log(arrObj.length);
// 获取选中radio的值
for(var i = 0; i < arrObj.length; i++) {
    if(arrObj[i].checked) {
        console.log(arrObj[i].value);
    }
}

 

二,选中

for(var i = 0; i < arrObj.length; i++) {
    // 选中某个value的选项
    if(arrObj[i].value == "year") {
        arrObj[i].checked = true;
    }
    // 选中第三个
    if(i == 2){
        //arrObj[i].checked = true;
        arrObj[i].checked = "checked";
    }
}

 

 

jQuery操作

一,获取

// 获取radio数量
console.log($("input:radio[name='type']").length);
// 获取选中radio的值
console.log($("input:radio[name='type']:checked").val());

 

二,选中

// 选中某个value的选项
$("input:radio[name='type'][value=year]").prop("checked", "checked");
// 选中第几个选项
$("input:radio[name='type']").eq(2).prop("checked", "checked");
// 选中第一个,选中最后一个
$("input:radio[name='type']:first").prop("checked", "checked");
$("input:radio[name='type']:last").prop("checked", "checked");

 

// extra:获取radio节点
// 1.伪元素
$("input:radio");
// 2.type
$("input[type='radio']");

// extra:选中方式
// 1.click
$("input:radio[name='type'][value=year]").click();
// 2.prop
$("input:radio[name='type'][value=year]").prop("checked", "checked"); // 推荐
$("input:radio[name='type'][value=year]").prop("checked", true);