javascript - 单击后如何禁用按钮

Question

晚上好。我正在做我的第一个 JavaScript 项目，在调用函数后我无法禁用按钮。如果我只写“禁用”，我的段落就不会出现，所以主要功能不起作用。但是，如果我将“禁用”放在主要功能上，则不会发生任何事情。如何确保单击按钮后，我的消息会出现并且按钮不再起作用？

谢谢你的时间！

function prize() {
  let para = document.createElement('youwon');
  para.textContent = 'VOCÊ ACERTOU!';
  para.style.cssText = "margin-top: 3vh; font-family: 'Poppins', sans-serif; color: rgb(228, 222, 222); font-size: 20px;"
  document.body.appendChild(para);
  let newbtn = document.createElement('INPUT');
  newbtn.setAttribute("type", "button");
  newbtn.setAttribute("value", 'Fechar guia');
  newbtn.style.cssText = "text-decoration: none; text-align: center; align-content: center; font-weight: 600; margin-top: 1vh; margin-bottom: 1vh; letter-spacing: 1.5px; font-size: 14px; background:rgb(236, 232, 232); border-radius:30px; width: 200px;height: 30px; text-align: center; justify-content: center; border: 2px solid  #1b2029; color: #1b2029; cursor:pointer;"
  document.body.append(newbtn);
  newbtn.addEventListener('click', Fechar);
  button.disabled = true;
}

function closewindow() {
  window.close();
}

function Fechar() {
  window.close();
}


var random = Math.floor(Math.random() * 10) + 1;

for (var i = 1; i <= 10; i++) {
  console.log(i);
  var button = document.querySelector('input.btn' + i);
  if (random == i) {
    button.addEventListener('click', prize);
  } else {
    button.addEventListener('click', closewindow);
  }
}

<main class="container">
  <div class='allButtons'>
    <div class="botao1">
      <input type="button" value="Será que é aqui?" class='btn1'>
    </div>
    <div class="botao2">
      <input type="button" value="Será que é aqui?" class='btn2'>
    </div>
    <div class="botao3">
      <input type="button" value="Será que é aqui?" class='btn3'>
    </div>
    <div class="botao4">
      <input type="button" value="Será que é aqui?" class='btn4'>
    </div>
    <div class="botao5">
      <input type="button" value="Será que é aqui?" class='btn5'>
    </div>
    <div class="botao6">
      <input type="button" value="Será que é aqui?" class='btn6'>
    </div>
    <div class="botao7">
      <input type="button" value="Será que é aqui?" class='btn7'>
    </div>
    <div class="botao8">
      <input type="button" value="Será que é aqui?" class='btn8'>
    </div>
    <div class="botao9">
      <input type="button" value="Será que é aqui?" class='btn9'>
    </div>
    <div class="botao10">
      <input type="button" value="Será que é aqui?" class='btn10'>
    </div>
  </div>
</main>

标签： javascriptbutton