jq对复选框的操作

HTML代码:

<div class="xz"><input name="cjxz" type="checkbox"/><span>养老</span></div>
<div class="xz"><input name="cjxz" type="checkbox"/><span>失业</span></div>
<div class="xz"><input name="cjxz" type="checkbox"/><span>医疗</span></div>
<div class="xz"><input name="cjxz" type="checkbox"/><span>工伤</span></div>
<div class="xz"><input name="cjxz" type="checkbox"/><span>生育</span></div>

这里写图片描述

文字点击,选中对应的复选框,代码附上

 $(".xz").click(function () {    
        if ($(this).children("input").is(':checked')) {
            $(this).children("input").removeAttr("checked");
        } else {
            $(this).children("input").prop("checked", true);
        }
  });

点击复选框选中

$(".xz input").click(function () {
        if ($(this).is(':checked')) {
            $(this).removeAttr("checked");
        } else {
            $(this).prop("checked", true);
        }
 });

判断是否全部选中

 if($('[name="cjxz"]:checked').length == 0){   
        alert("没有全部选中!");
        return false;
 }

单个选中判断,ture为选中,false未选中

if($('选择器').is(':checked')){
    alert('选中了');
}else{
    alert('未选中');
}

单个添加选中

 $('选择器').prop("checked", true);

单个移除选中

 $('选择器').removeAttr("checked");
posted @ 2018-08-09 17:34  豆园子  阅读(1655)  评论(0编辑  收藏  举报