JavaScript：用户单击一次后如何禁用 JavaScript 中的多个按钮答案

【问题标题】：JavaScript : How do disable multiple buttons in JavaScript after the user clicks onceJavaScript：用户单击一次后如何禁用 JavaScript 中的多个按钮
【发布时间】：2021-07-17 07:05:40
【问题描述】：

这是我尝试过的所以我试图在用户选择一个选项后禁用我的测验应用程序中的选项按钮。

我这样做是因为当用户选择任何选项后显示正确选项时，如果我再次单击正确答案，则分数计数器会增加，并且如果用户选择错误答案，然后如果他选择正确答案，那么他可以继续游戏。

这是问答游戏，看看问题=> https://coderjm1.github.io/guessthisflag.github.io/

HTML

<div id="answer-buttons" class="btn-grid">
    <button  class="btn" onclick="disable()">Answer1</button>
    <button  class="btn" onclick="disable()">Answer2</button>
    <button class="btn" onclick="disable()">Answer3</button>
    <button class="btn" onclick="disable()">Answer4</button>
</div>

JAVASCRIPT

function disable() {
    let elems = document.getElementsByClassName('btn')
    for(let i = 0; i < elems.length; i++){
        elems[i].disable = true;
    }
}

【问题讨论】：

属性是disabled而不是disable。所以，elems[i].disabled = true; 这将禁用按钮

标签： javascript html button disable

【解决方案1】：

您可以使用querySelectorAll 和setAttribute('disabled',true) 遍历它们

function disable() {
  document.querySelectorAll('.btn').forEach(el => el.setAttribute('disabled', true));
}

<div id="answer-buttons" class="btn-grid">
  <button class="btn" onclick="disable()">Answer1</button>
  <button class="btn" onclick="disable()">Answer2</button>
  <button class="btn" onclick="disable()">Answer3</button>
  <button class="btn" onclick="disable()">Answer4</button>
</div>

【讨论】：

即使我使用了你的代码并把它放到我的项目中它仍然不起作用
我无法想象为什么不......这是非常简单的代码

【解决方案2】：

将“禁用”替换为“禁用”

function disable() {
    let elems = document.getElementsByClassName('btn')
    for(let i = 0; i < elems.length; i++){
        elems[i].disabled = true;
    }
}

【讨论】：

【解决方案3】：

您使用的是“禁用”而不是“禁用”
会是这样的

elems[i].disabled = true;

【讨论】：

【解决方案4】：

使用 querySelectorAll 获取按钮数组，它应该可以工作

function disable() {
  let elems = document.querySelectorAll('.btn')
  for(let i = 0; i < elems.length; i++){
      elems[i].disabled = true;
  }
}

【讨论】：