Jquery全选与反选点击执行一次的解决方案

网络编程 2024/11/20 佚名

3 2 1

代码需求，使用attr只能执行一次，使用prop则完美实现全选和反选，获取所有选中的项并把选中项的文本组成一个字符串。

解决方案一：

代码如下：

<html>
<head>
　　<script src="/UploadFiles/2021-04-02/jquery-1.11.1.min.js">

总结：
对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。
参考 https://www.jb51.net/article/62308.htm
解决方案二：
问题描述：


$(".chooseall").click(function(){
 if($(".chooseall").attr("checked") == "checked"){
$("input[name='checkbox1']").removeAttr("checked","checked");
 console.log(1);
 }else{
 $("input[name='checkbox1']").attr("checked","checked");
 console.log(2);
 }
});



上面的这个代码第一次点击和第二次点击，能实现全选和反选功能，但一遍之后就不再起作用，这是什么情况啊

除了第一个checkbox之外，其余的都是ajax动态生成的，跟这个有关系么？console.log每次点击的都能交替输出1和2，但就是中间的代码不能执行。
解决方案：
removeAttr参数只需要一个，removeAttr("checked")

不过建议替换成


$(".chooseall").click(function(){
 if($(".chooseall").prop("checked") == true){
 $("input[name='checkbox1']").prop("checked", false);
 console.log(1);
 }else{
 $("input[name='checkbox1']").prop("checked", false);
 console.log(2);
 }
});


或者更简洁的，


$(".chooseall").click(function(){
 var isChecked = $(this).prop("checked");
 $("input[name='checkbox1']").prop("checked", isChecked);
});



以上是Jquery全选与反选点击执行一次的解决方案，希望对大家有所帮助。