Question

我使用jquery 1.6.1检查所有一组复选框这是我的HTML代码：

 <form action="">
    <div class="stats">
      <h2 class="title">Reason for Celebrity</h2>
      <input name="reason" type="checkbox" value="net" />Famous on the internet<br/>
      <input name="reason" type="checkbox" value="crim" />Committed a crime<br />
      <input name="reason" type="checkbox" value="model" />Dates a super model<br />
      <input name="reason" type="checkbox" value="tv" />Hosts a TV show<br />
      <input name="reason" type="checkbox" value="japan" />Big in Japan<br />
      <hr />
      <input class="check-all" name="reason" type="checkbox" /><span>Check all</span>
      <br/>
      <input type="submit" value="Submit" class="submit" />
    </div>
  </form>

和我检查所有的脚本是这样的：

$(document).ready(function(){
  $('.check-all:checkbox').change(function() {
    var group = ':checkbox[name=' + $(this).attr('name') + ']';
    $(group).attr('checked', $(this).attr('checked'));
  });
});

但这不能取消选中复选框。你能帮我解决这个问题吗？

Answer 1

尝试替换

$(group).attr('checked', $(this).attr('checked'));

带

$(group).attr('checked', $(this).is(':checked'));

Answer 2

$(this).attr('checked') - 返回undefined

你应该这样做：

var variable = (undefined == $(this).attr('checked'))?false:$(this).attr('checked');
$(group).attr('checked', variable);

避免未定义的值

Answer 3

问题是您未明确添加任何选项以取消选中复选框。一个正确的方法是

$(document).ready(function(){
   $('.check-all:checkbox').change(function(event) {
    var group = ':checkbox[name=' + $(this).attr('name') + ']';
      $(group).each(function(){
      this.checked = event.target.checked;
      });
  });
});

工作小提琴：

http://jsfiddle.net/PmuLz/2/

我的checkAll Checkboxes脚本不起作用

3 个答案: