又犯老错误，jquery实现全选删除

最新推荐文章于 2022-12-28 19:58:46 发布

cutemurphy

最新推荐文章于 2022-12-28 19:58:46 发布

阅读量241

点赞数

分类专栏： Jquery学习文章标签： jquery function 浏览器 button

本文链接：https://blog.csdn.net/cutemurphy/article/details/6703087

版权

Jquery学习专栏收录该内容

18 篇文章 0 订阅

订阅专栏

<body>
<input type="checkbox" name="">1</br>
<input type="checkbox" name="">2</br>
<input type="checkbox" name="">3</br>
<input type="checkbox" name="">4</br>
<input type="checkbox" name="" id="all">全选删除</br>
<script type="text/javascript" src="jquery-1.5.1.js"> </script>
<script type="text/javascript">
$("#all").click( // 一开始把这本遗漏啦，想当然认为，只需要个判断就行，而忘记判断是在点击行为后发生的
function( ){
if($(this).is(":checked")){
$(":checkbox").attr("checked",true);
}else{
$(":checkbox").attr("checked",false);
}
} )

</script>

</body>

错误之处：

一开始忘记写$("#all").click，直接if($(this).is(":checked")）就将所有的checkbox勾选，但这里恰恰忘记了注册事件，其实全选是在点击id=all之后的，所以应该要注册个事件，否则浏览器一开始就把代码全部读完，并不会返回再去判断，id=all是否被选，如果要让浏览器返回，必须给它注册个事件。

第二步：

id=shan是个button按纽

$("#shan").click(function( ){
var count=$(":checkbox:checked:not('#all')").length // 判断有多少个checkbox被选中，不包括全选checkbox本身，统计数字
if(count>0){ // 大于0则说明有被选中的
$(":checkbox").each(function( ){ //遍历，如果是被选中的，则删除
if(this.checked){

//也可不用遍历，直接$（":checkbox:checked"）.remove( )
$(this).remove( );
}
}
)}
})