摘要:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script type="text/javascript" src="jq_3.3.1_mi.js"></script>
<title>Document</title>
</head>
<body>
<div>
<input type="checkbox" id="checkAll"> <label for="checkAll"> JQ全选</label>
<input type="checkbox" id="checkAll_JS" onclick="checkAll_JS()"> <label for="checkAll_JS">JS全选</label>
<hr>
<input type="checkbox" name="checkOne[]" id="1"> <label for="1"> 1</label><br>
<input type="checkbox" name="checkOne[]" id="2"> <label for="2"> 2</label><br>
<input type="checkbox" name="checkOne[]" id="3"> <label for="3"> 3</label><br>
<input type="checkbox" name="checkOne[]" id="4"> <label for="4"> 4</label><br>
<input type="checkbox" name="checkOne[]" id="5"> <label for="5"> 5</label><br>
</div>
<script>
//
// // js写法
function checkAll_JS(){
var checkAll_js=document.getElementById("checkAll_JS");
var all_js=document.getElementsByName('checkOne[]');
for (var i = 0; i < all_js.length; i++) {
if(checkAll_js.checked){
all_js[i].checked=true;
}else{
all_js[i].checked=false;
}
}
}
// JQ写法
// jquery attr()方法获取标签的 checked 会有问题,所以用了 prop() 方法。
$(function(){
$("#checkAll").on('click',function(){
var ck=$(this).prop('checked');
var all=$("input[name='checkOne[]']");
if(ck){
for (var i = 0; i < all.length; i++) {
$(all[i]).prop('checked',true);
}
}else{
for (var i = 0; i < all.length; i++) {
$(all[i]).prop('checked',false);
}
}
})
})
</script>
</body>
</html>
批改老师:天蓬老师批改时间:2019-02-15 16:11:28
老师总结:prop('checked',false);这个方法用得好