1.单选框
html代码
<div class="radio-inline">
<input type="radio" name="radio2" value="1"/>
<label for="order1">是</label>
</div>
<div class="radio-inline">
<input type="radio" name="radio2" value="0" checked/>
<label for="order2">否</label>
</div>
<!--这是禁选状态的单选框-->
<div class="radio-inline">
<input type="radio" name="radio2" value="2" disabled/>
<label for="order3">否</label>
</div>
js代码
//获取单选框选中的值
$("input[name='radio2']:checked").val();
//设置其中一个为选中状态
$("input:radio[value='0']").attr('checked', 'checked');
$("input:radio[value='0']").attr('checked', true);
//设置单选框为禁选
$("input:radio[value='0']").prop("disabled", true);
//取消单选框选中状态
$("input:radio").removeAttr("checked");
$("input:radio").attr('checked', false);
//遍历radio
$('input:radio').each(function(index, domEle) {
console.log($(domEle).val())
});
//单选框点击事件
$('input[name="radio2"]').change(function() {
console.log($(this).val())
})
2.复选框
html代码
<label>input复选1组:</label>
<input type="checkbox" name="checkbox1" value="checkbox复选1" />checkbox复选1
<input type="checkbox" name="checkbox1" value="checkbox复选2" disabled/>checkbox复选2
<input type="checkbox" name="checkbox1" value="checkbox复选3" checked />checkbox复选3
js代码
//选中某一项
$("input[name='checkbox1'][value='checkbox复选3']").prop("checked", true);
//取消选中某一项
$("input[name='checkbox1'][value='checkbox复选3']").removeAttr("checked");
//设置某一项为禁选
$("input[name='checkbox1'][value='checkbox复选3']").prop("disabled", true);
//获取选中的值
var checkArr = [];
$('input[name="checkbox1"]:checked').each(function() {
checkArr.push($(this).val());
});
console.log(checkArr)