jQuery检查复选框不起作用

问题描述：

我试图在使用JQuery 1.9.1的HTML表单上实现“全选”复选框。据我所知，它应该就像使用.prop来检查或取消选中复选框一样简单，但没有任何我尝试似乎工作。jQuery检查复选框不起作用

请参阅下面的内容，我已经尝试过了，我已经注释了一些失败的尝试，并且我甚至无法为一个复选框工作。什么是正确的方法来做到这一点？我错过了什么，可能在HTML？

HTML

<input type="checkbox" id="cb_select_all" name="cb_select_all" value="t" /> 
<label for="cb_select_all"><b>Select All</b> 
</label> 
<br /> 
<input type="checkbox" name="cb1" id="cb1" class="cb_all" value="t" /> 
<label for="cb1">1 test</label> 
<br /> 
<input type="checkbox" name="cb2" id="cb2" class="cb_all" value="t" /> 
<label for="cb2">2 test</label>

的Javascript

$(document).ready(function() { 
    $("#cb_select_all").change(cb_select_all_onchange); 
}); //end $(document).ready 

function cb_select_all_onchange() { 
    if ($("#cb_select_all").checked) { 
     //$("#cb1").prop("checked", true); 
     //$(".cb_all").each(function(){ this.checked = true; }); 
     //document.getElementById("cb1").checked = true; 
     $(".cb_all").prop("checked", true); 
    } else { 
     $("#cb1").prop("checked", false); 
    } 
}

http://jsfiddle.net/mLnb5qed/5/

感谢， JDT

答

更改if这个

if ($("#cb_select_all")[0].checked) { }

（或）if ($("#cb_select_all").is(":checked")) { } 问题是第一个是native元素而不是jQuery对象的属性。通过索引访问它可以让您使用该属性。第二种方式是jQuery方式。

您使用的ID选择，'[0]'不需要，除非有非法的HTML继续。另外，'.checked'是一个DOM属性，而不是一个jQuery属性。 – 2014-10-09 14:52:49

@SterlingArcher好吧，我认为你必须认识事物。我也说'.checked'是一个DOM属性。 – 2014-10-09 14:56:35

哎呀，我完全错过了！你是对的，我的坏！ – 2014-10-09 14:58:42

答

使用

$("#cb_select_all").is(':checked');

你可以扩展为什么这个代码解决了原始海报的问题吗？一般只有代码解答才会被解释。 – jakerella 2014-10-09 15:19:07

我觉得很明显，不需要解释如何在代码中使用它...... – Balder 2014-10-10 07:27:56

这不是重点，这些类型的答案被标记，这就是为什么它收到评论。请尽可能详细说明您的答案。 – jakerella 2014-10-10 12:16:10

答

这为我工作：

$(document).ready(function() { 
     $("#cb_select_all").change(function() { 
      if ($("#cb_select_all").prop("checked") == true) { 
       $('.cb_all').prop('checked', true); 
      } 
      else { 
       $('.cb_all').prop('checked', false); 
      } 
     }); 
    });

会发生什么：

Check if the "cb_select_all" checkbox changes state 
if the "checked" state is set to true 
    check all "cb_all" checkboxes 
else 
    uncheck all "cb_all" checkboxes

jQuery检查复选框不起作用

相关推荐