如何实现点击后消失的表单字段随机数生成按钮？

你合并代码后功能失效的核心原因是：random函数里的button变量未定义，JavaScript无法定位到按钮元素，导致隐藏逻辑执行失败。以下是两种可行的实现方案：

方案一：给按钮添加ID，在函数中获取元素 #

通过给按钮设置唯一ID，在生成随机数的同时获取该按钮并隐藏：

<html>
<body>
  <p id="one"></p>
  <button id="generateBtn" onclick="random()">Generate</button>

  <script>
    function random(){
      // 生成并显示随机数
      document.getElementById("one").innerHTML = Math.floor(Math.random() * 999999);
      // 获取按钮并隐藏
      document.getElementById("generateBtn").style.display = 'none';
    }
  </script>
</body>
</html>

方案二：点击时传递按钮自身到函数 #

直接在onclick事件中把按钮对象作为参数传入函数，无需额外定义ID：

<html>
<body>
  <p id="one"></p>
  <button onclick="random(this)">Generate</button>

  <script>
    function random(button){
      // 生成并显示随机数
      document.getElementById("one").innerHTML = Math.floor(Math.random() * 999999);
      // 隐藏当前点击的按钮
      button.style.display = 'none';
    }
  </script>
</body>
</html>

以上两种方案都能实现：点击「Generate」按钮后生成随机数，同时按钮立即隐藏，确保用户只能执行一次随机数生成操作。

内容的提问来源于stack exchange，提问作者Q-Tip