Question

检查/取消选中位于触发我的功能的元素内的复选框的正确方法是什么？

这是我的代码：

<table id="news_list">
<tr>
    <td><input type="checkbox" name="news[1]" /></td>
    <td>TEXT</td>
</tr></table>

$("#news_list tr").click(function() {
    var ele = $(this).find('input');
    if(ele.is(':checked')){
        ele.removeAttr('checked');
        $(this).removeClass('admin_checked');
    }else{
        ele.attr('checked', 'checked');
        $(this).addClass('admin_checked');
    }
});

问题是我只能检查并取消选中每个方框一次。在我检查并取消选中之后，它仍然会添加/删除类，但从不再次检查一个框（即使我单击复选框，而不是表行）。

我尝试过使用.bind（'click'）触发器，但结果相同。

任何解决方案？

Answer 1

使用.prop()代替，如果我们使用您的代码，请按照以下方式进行比较：

查看示例jsbin：

  $("#news_list tr").click(function () {
    var ele = $(this).find(':checkbox');
    if ($(':checked').length) {
      ele.prop('checked', false);
      $(this).removeClass('admin_checked');
    } else {
      ele.prop('checked', true);
      $(this).addClass('admin_checked');
    }
 });

的变化：

将input更改为:checkbox。
比较the length。{/ li>的checked checkboxes

Answer 2

使用prop（）而不是attr（）来设置checked的值。也可以在find方法中使用:checkbox而不是input，并且具体。

Live Demo

$("#news_list tr").click(function() {
    var ele = $(this).find('input');
    if(ele.is(':checked')){
        ele.prop('checked', false);
        $(this).removeClass('admin_checked');
    }else{
        ele.prop('checked', true);
        $(this).addClass('admin_checked');
    }
});

Use prop instead of attr for properties like checked

从jQuery 1.6开始，.attr（）方法为属性返回undefined 尚未设定。检索和更改DOM属性，例如选中，选中或禁用表单元素的状态，使用 .prop（）方法

Answer 3

 $('mainCheckBox').click(function(){
    if($(this).prop('checked')){
        $('Id or Class of checkbox').prop('checked', true);
    }else{
        $('Id or Class of checkbox').prop('checked', false);
    }
});

jQuery复选框选中/取消选中

3 个答案: