当前位置：Gxlcms > JavaScript > checkbox选中后再次选中失效该如何解决？

checkbox选中后再次选中失效该如何解决？

时间：2021-07-01 10:21:17 帮助过：25人阅读

传统选中取消代码如下：

[html] view plain copy
 print?
<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="utf-8">  
    <meta http-equiv="X-UA-Compatible" content="IE=edge">  
    <title></title>  
    <script type="text/javascript" src="../js/jquery-1.11.2.min.js"></script>  
</head>  
<body>  
    <input type="checkbox" name="checkbox" id="checkbox" >  
    <input type="button" onclick="btn_submit();" name="" id="btn_submit" value="选中">  
    <input type="button" onclick="btn_cancel();" id="btn_cancel" value="取消选中">  
</body>  
    <script>  
        var btn_cancel = function(){  
            <span style="color:#ff0000;">$("#checkbox").attr('checked',false);</span>  
        };  
        var btn_submit = function(){  
            <span style="color:#ff0000;">$("#checkbox").attr('checked',true);</span>  
        };  
    </script>  
</html>

//问题点

初始状态复选框没有全选，

点击全选按钮调用checkAll方法，

实现了全选，

然后点击全不选按钮，

实现了全不选，

然后再次点击全选按钮，

结果却木有全选，

再反复点击木有任何反应。

demo:

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><script src="js/jquery-1.11.3.min.js?1.1.11"></script><script>$(function () {
            $("#allchoose").click(function () {
                    $(":checkbox").prop("checked",true);
            })
            $("#allnochoose").click(function () {if ($(":checkbox").is(":checked")){
                    $(":checkbox").attr("checked",false);
                }
            })
            $("#choose").click(function () {if($(":checkbox").is(":checked")){
                    $(":checkbox").attr("checked",false);
                }else{
                    $(":checkbox").prop("checked",true);
                }
            })
        })</script></head><body><input type="checkbox" name="checkbox" id="">乒乓球<input type="checkbox" name="checkbox" id="">羽毛球<input type="checkbox" name="checkbox" id="">足球<input type="checkbox" name="checkbox" id="">篮球<input type="checkbox" name="checkbox" id="">排球<br><input type="button" value="全选" id="allchoose"><input type="button" value="全不选" id="allnochoose"><input type="button" value="反选" id="choose"><input type="submit" value="提交" id="submit"></body></html>

以上就是checkbox选中后再次选中失效该如何解决？的详细内容，更多请关注Gxl网其它相关文章！

checkbox选中后再次选中失效该如何解决？

人气教程排行