jQuery1.9.1 checkboxに対する調整
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コード部分は以下の通り
HTMLコード部分は以下の通りです
選択したかどうかを判断する
$('#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>