jQuery1.9.1 checkboxに対する調整

2001 ワード

jquery 1.8にあります.xのバージョンでは、checkboxの選択と選択しない操作は次のとおりです.
選択したかどうかを判断する
$('#checkbox').prop('checked')
選択された状態と選択されていない状態を設定します.
$('#checkbox').attr('checked',true)
$('#checkbox').attr('checked',false)
ただし、この方法はjquery 1である.9.1では、処理が異なるものもあります
IE 10,Chrome,FFでは,選択状態に対して初めて$('#checkbox').attr('checked',true)は実現可能
しかし、コードクリアで選択すると、今度はコード$('#checkbox')を通過する.attr('checked',true)が選択されている場合
コードにはchecked='checked'がありますが、画面表現はチェックされていません.
IE 8,IE 6ではこの問題はありません.
その後、関連資料を調べたところ、attr('checked',true)はprop('checked',true)に変更されていることが分かった.
以下、JQ 1を示す.8.x以降の全選逆選のJQ例
JSコード部分は以下の通り
$(function(){
  $("#select_yes").click(function(){
    $("input[name=id]").each(function(){
      $(this).prop("checked",true);
    });
  });
  $("#select_no").click(function(){
    $("input[name=id]").each(function(){
      $(this).prop("checked",false);
    });
  });
});

HTMLコード部分は以下の通りです
    <input type="checkbox" value="1" name="id"><br/>  
    <input type="checkbox" value="2" name="id"><br/>  
    <input type="checkbox" value="3" name="id"> <br/>  
    <input type="checkbox" value="4" name="id"> <br/>  
    <input type="checkbox" value="5" name="id"> <br/>  
    <input type="checkbox" value="6" name="id"> <br/>  
    <input type="checkbox" value="7" name="id"> <br/>  
<a href="javascript:void(0);" id="select_yes">  </a> 
<a href="javascript:void(0);" id="select_no">  </a>