选中/取消选中单选按钮JavaScript

问题描述 投票:0回答:1

有人可以帮我这个吗?当我将a()设置为#j1并将b()设置为#j2时,一切正常(单击选中一个单选按钮,而另一个未选中),但是当我将两个都设置为c()时,它仅在我先单击按钮2,再单击按钮1,然后卡住。我也尝试过使用循环,但是我猜它的逻辑存在一个固有的错误。

谢谢。丹尼尔

<body>

    <input type="radio" id="j1" onclick="c()"><label for="j1">1</label>
    <input type="radio" id="j2" onclick="c()"><label for="j2">2</label>

    <script>
        const j1 = document.querySelector("#j1");
        const j2 = document.querySelector("#j2");

        function a(){
            j1.checked = true;
             j2.checked = false;
         }

        function b(){
            j1.checked = false;
            j2.checked = true;
        }

        function c(){
                if(j1.checked===true){
                    j2.checked=false;
                }
                else if(j2.checked===true){
                    j1.checked=false;
                }
            }
    </script>
</body>
javascript radio
1个回答
1
投票

您似乎正在尝试复制默认的单选按钮行为。在name="foo"上设置<input>属性,它们将为您形成一个仅选择一个组。


0
投票

我不确定您要问哪个,但我认为您需要这样的东西:

const j1 = document.querySelector("#j1");
const j2 = document.querySelector("#j2");

function a() {
    j2.checked = false;
}

function b() {
    j1.checked = false;
}
<body>
    <input type="radio" id="j1" onclick="a()"><label for="j1">1</label>
    <input type="radio" id="j2" onclick="b()"><label for="j2">2</label>
</body>
© www.soinside.com 2019 - 2024. All rights reserved.