首页 > 解决方案 > 选中/取消选中单选按钮 JavaScript

问题描述

有人可以帮我解决这个问题吗?当我将 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>

标签: javascriptradio

解决方案


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


推荐阅读