Question

下面是我的代码，它只使用select all的一个循环并取消全部。如果我将语法更改为.change而不是.on('change')，它可以正常工作。即使.change可以达到1.8.3版本的jquery，但在此之后也没有。

<div id="mainframe" align="center">
  <div align="left"><strong>Select All CheckBox Demo.</strong></div>
  <table border="0" cellpadding="5" cellspacing="1" class="table">
    <th><input type="checkbox" id="selectall"/></th>
    <th>Programming Language</th>
    <th>Rating</th>
    <tr>
      <td align="center"><input type="checkbox" class="case" name="case" value="1"/></td>
      <td>PHP</td>
      <td>5</td>
    </tr>
    <tr>
      <td align="center"><input type="checkbox" class="case" name="case" value="2"/></td>
      <td>JSP</td>
      <td>4</td>
    </tr>
    <tr>
      <td align="center"><input type="checkbox" class="case" name="case" value="3"/></td>
      <td>ASP</td>
      <td>3</td>
    </tr>
  </table>
</div>

$("#selectall").on('change',function () {
  if($(this).is(":checked")){
    $('.case').attr('checked',true);
  }else{
    $('.case').attr('checked',false);
  }
});

Pen

Answer 1

问题与attr的使用方式有关。使用prop来简化它。

$(function(){
    $("#selectall").on('change',function () {
        $('.case').prop('checked', this.checked);
    });
});

<强> Fiddle

根据您在评论中的问题进行更新

jquery版本1.3.2不支持on以及prop。这是一个非常古老的版本，其中attr本身可能处理特定的属性值（对于元素attribute）或布尔值（对于元素property）来添加/删除属性值（在属性的情况下）这类（checked，selected ...））或基于指定值的类型设置或取消设置元素属性。更高版本的jquery引入了prop来设置元素属性，attr来设置元素属性。可能这就是原因。另请注意，jquery的1.3.2版本不支持on。

Answer 2

你需要使用

$('.case').attr('checked', 'checked');

或

$('.case').prop('checked', true);

此外，您可以在一行代码中执行此操作：

$(function(){
    $("#selectall").on('change',function () {
        $('.case').prop('checked', $(this).is(":checked"));
    });
});

这是一个jsFiddle：http://jsfiddle.net/BWWph/

on（'change'）没有按预期工作

Pen

2 个答案: