jQuery判断checkbox是否选中的方法和动态选择和反选

今天用jQuery 做一个全选,结果尴尬了,脑子短路了不知道怎么判断是否选中;
写给以后的自己。


下面是一个完整的全选/反选的例子:

<input type="checkbox" id="wholeSelect" value=""><!--全选按钮-->
<input type="checkbox" name="checkbox" value="1">
<input type="checkbox" name="checkbox" value="2">
<input type="checkbox" name="checkbox" value="3">
<input type="checkbox" name="checkbox" value="4">

方法一:

//推荐使用
var wholeSelect=$('#wholeSelect');
wholeSelect.change(function (e) {
    var _this=$(this);
    //判断全选按钮是否选中
    if (_this.is(':checked')){//选中时的操作
        $('input[name="checkbox"]').prop("checked",true);
    }else{//未选中时的操作
        $('input[name="checkbox"]').prop('checked',false);
    }
});

方法二:

//不推荐使用
var wholeSelect=$('#wholeSelect');
wholeSelect.change(function (e) {
    var _this=$(this);
    //判断全选按钮是否选中
    //注意:这种方式有个问题,如果你是动态选中且方法是用".attr('checked',true)",这时候下面的方法将不准确。
    if (_this.attr(':checked')){
        //选中时的操作
    }else{
        //未选中时的操作
    }
});

动态让checkbox选中 / 反选

//方式一
$('input[name="checkbox"]').prop("checked",true);//选中 推荐使用prop的方式
$('input[name="checkbox"]').prop('checked',false);//取消选中

//方式二
$('input[name="checkbox"]').attr("checked",true);//选中 注意:用attr方式只能选中一次,第二次是无效的
$('input[name="checkbox"]').attr('checked',false);//取消选中

猜你喜欢

转载自blog.csdn.net/qq_36308324/article/details/78541393