チェックボックスの全選択反転実装(ショッピングカートのチェックボックス実装)
1870 ワード
今週の仕事では、全選をするときに殻にぶつかって、暇な時間に全選のいくつかの実現方法を整理します.htmlページ
jsコード
の
2の
3の ( js)
jsコード
の
//
$("#allCheck").click(function(){
if($(this).attr("checked")){
$("input[name='check']").attr("checked",true);
}else{
$("input[name='check']").attr("checked",false);
}
})
//
$("input[name='check']").change(function(){
if($("input[name='check']").not("input:checked").size() <= 0){
$("#allCheck").attr("checked",true);
}else{
$("#allCheck").attr("checked",false);
}
})
2の
//
$("#allCheck").click(function(){
$("input[name='check']").prop("checked",this.checked);
})
//
$("input[name='check']").change(function(){
if($("input[name='check']").not("input:checked").size() <= 0){
$("#allCheck").prop("checked",true);
}else{
$("#allCheck").prop("checked",false);
}
})
3の ( js)
//
$("#allCheck").click(function(){
var a = document.getElementById("allCheck");
var b = document.getElementsByName("check");
if(a.checked){
for(var i = 0; i < b.length; i++){
b[i].checked = true;
}
}else{
for(var i = 0; i < b.length; i++){
b[i].checked = false;
}
}
})
//
$("input[name='check']").click(function(){
var flag = true;
var a = document.getElementById("allCheck");
var b = document.getElementsByName("check");
for(var i = 0; i < b.length; i++){
if(!b[i].checked){
flag = false;
break;
}
}
a.checked = flag;
});