javascript - 在 ('change' 上)未按预期工作

Question

下面是我的代码，它只工作一个全选和取消全选的循环。如果我将语法更改为 .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)或 bool 值(对于元素 property)/remove 属性值(如果是此类属性(checked、selected...))或根据指定值的类型设置或取消设置元素属性。后来版本的jquery引入了用于设置元素属性的prop和用于设置元素属性的attr。大概就是这个原因。另请注意，1.3.2 版本的 jquery 不支持 on。