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

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

on***de 分类：JavaScript 人气：896 回帖：5 发布于6年前收藏

有多个 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

标签：jquery javascript

讨论这个帖子（5）垃圾回帖将一律封号处理……

Lv4 码徒

闪***星 CEO 6年前#1

$('input[type="checkbox"]').each(function(){
    $(this).click(function(e){
        $('input[type="checkbox"]').prop('checked',false);
        $(this).prop('checked',true);
    });
});

Lv7 码师

Sl***rk 软件测试工程师 6年前#2

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

Lv4 码徒

cx***de 页面重构设计 6年前#3

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

$('input[type="checkbox"]').each(function(){                                
        $(this).change(function(){           
            $(this).siblings().prop('checked',false);   
    })
});

Lv3 码奴

雨***梦页面重构设计 6年前#4

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

$("input[name='myname']").prop("checked",false);

Lv5 码农

麦***j 产品经理 6年前#5

疑问：

只能选择一个

为什么不用单选？

<!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>

文明上网，理性发言！ 😉 阿里云幸运券，戳我领取