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

【问题标题】：Check/Uncheck radio buttons JavaScript选中/取消选中单选按钮 JavaScript
【发布时间】：2020-04-29 03:20:40
【问题描述】：

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

【问题讨论】：

你到底想要什么？
您不能“将 a() 设置为 #j1”。你的意思是“设置#j1 使用a()”，对吧？

标签： javascript radio

【解决方案1】：

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

【讨论】：

就是这样！我忘了使用 name 属性，我尝试用 JavaScript 复制它。谢谢！
很高兴能帮上忙！那么请将问题标记为已回答。 :)

【解决方案2】：

我不确定你问的是哪个，但我认为你需要这样的东西：

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>

【讨论】：

感谢您的贡献。我刚开始使用单选按钮和 JavaScript，因为我遗漏了输入的名称属性，所以我尝试用 JavaScript 模拟它。 a() 和 b() 工作正常，但我试图将它们合并到 c() ，这就是一切都出错的地方。无论如何，感谢您的意见:)