如何使按钮可点击多次

Question

我真的不知道如何命名这个问题。

我做了一个简单的代码，点击一个按钮会在屏幕上显示一个随机数。但是我遇到了一个问题，每次显示数字时按钮都会“锁定”自己，您需要重新加载页面以再次单击它。我的问题是我不想每次点击按钮都重新加载。

<div class="box" id="box">
        <p id="p1">Generate a number</p>
        <p id="p2">  <script src="main.js"></script></p>
        <div class="container">
        <button id="genbutton" class="button"  onclick="generator()">Generate</button>
        </div>
    </div>

function generator() {
    document.getElementById("p2").innerHTML = x;
    document.write.innerHTML(x);

  }

代码笔演示

Answer 1

这是因为您只生成x（随机数）一次。在您的 codepen 示例中，将生成移动x到事件处理程序中：

function generator() {
    var x = Math.floor(Math.random() * 1001);
    document.getElementById("p2").innerHTML = x;
}