问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

Checkbox 的 checked 属性为 false 了，但是还是显示打钩怎么办？

头像
esolve
    95573452560

    有多个 checkbox 只能选择一个 当有两个都被勾选，最后选的会让之前选的被取消打钩 我用下面的方法

        $(':checkbox[type="checkbox"]').each(function(){
        $(this).click(function(){
            if($(this).prop('checked')){
                $(':checkbox[type="checkbox"]').removeAttr('checked');
                $(this).prop('checked','true');
            }
        });
    });

    可是调试发现 前面的勾选依然显示打钩，虽然他们的属性 checked 为 false 了 怎么回事？

    之前用的是

    $(':checkbox[type="checkbox"]'). .prop('checked', false);

    这个不仅显示没有取消打钩
    连属性 checked 都继续为 true

    javascriptjquery
    阅读 26.1k
    6 个回答
    得票最新
    头像
    上官元恒
      8.7k73238

      疑问：

      只能选择一个

      为什么不用单选？

      <!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF-8">
        <title>
        </title>
    </head>
    <body>
        <div id="jie">
            <input type="checkbox">
            <input type="checkbox">
            <input type="checkbox">
            <input type="checkbox">
            <input type="checkbox">
            <input type="checkbox">
        </div>
        <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
        </script>
        <script>
            //不需要什么each的
            $('input[type="checkbox"]').on('change',function()
                {
                    $('input[type="checkbox"]').prop('checked',false);
                    $(this).prop('checked',true);
                });
        </script>
    </body>
</html>
      头像
      Reachel
        2.6k1114

        在html中checkbox标签只要有checked属性都会被选中，这里的checked是attribute，建议你单选用radio

        头像
        陌路凡歌
          7.9k21119

          prop里false和true不要加引号，你这种是用radio的情形吧。你应该在当前元素change时让其兄弟元素全部checked变为false，当前的不要变

          $('input[type="checkbox"]').each(function(){                                
        $(this).change(function(){           
            $(this).siblings().prop('checked',false);   
    })
});
          头像
          Leslie
            8511111
            $('input[type="checkbox"]').each(function(){
    $(this).click(function(e){
        $('input[type="checkbox"]').prop('checked',false);
        $(this).prop('checked',true);
    });
});
            头像
            easunlee
              1215

              checked 其实是个独立属性。 checked 和 checked="checked" 甚至 checked=1 都是一个意思。
              所以，设置的时候注意

              $("input[name='myname']").prop("checked",false);
              头像
              netnr
                387312
                <div id="divBox">
    <input type="checkbox" name="chk" value="1" />
    <input type="checkbox" name="chk" value="2" />
    <input type="checkbox" name="chk" value="3" />
    <input type="checkbox" name="chk" value="4" />
    <input type="checkbox" name="chk" value="5" />
</div>
                $('#divBox').click(function (e) {
    e = e || window.event;
    var target = e.target || e.srcElement;
    if (target.nodeName == "INPUT") {
        var tc = target.checked;
        $(this).find('input').attr('checked', false);
        target.checked = tc;
    }
});
                撰写回答
                你尚未登录，登录后可以
                • 和开发者交流问题的细节
                • 关注并接收问题和回答的更新提醒
                • 参与内容的编辑和改进，让解决方法与时俱进
                推荐问题