HTML PHP游戏开发：为无<button>标签的自定义按钮添加功能

没问题！要把你的自定义非<button>元素变成能触发「花费金币重置时间」功能的交互按钮，我们可以通过两种常见方式实现，下面结合你提供的表单代码来具体说明：

方案1：JavaScript绑定点击事件触发表单提交 #

如果你的自定义按钮是类似<div>、<span>这类普通元素，只需要给它绑定点击事件，手动触发对应表单的提交即可：

示例代码 #

<form action="game.php?page=buildings" method="post" class="build_form">
  <input type="hidden" name="queuetype" value="1">
  <input type="hidden" name="cmd" value="fast">
  
  <!-- 你的自定义按钮元素，这里以div为例 -->
  <div class="custom-reset-btn build_submit onlist tooltip" data-tooltip="花费金币重置时间">
    立即重置（消耗XX金币）
  </div>
</form>

<script>
// 获取自定义按钮和表单元素
const customBtn = document.querySelector('.custom-reset-btn');
const buildForm = document.querySelector('.build_form');

// 绑定点击事件，触发表单提交
customBtn.addEventListener('click', function() {
  buildForm.submit();
});
</script>

<style>
/* 给自定义按钮加鼠标指针样式，增强交互提示 */
.custom-reset-btn {
  cursor: pointer;
  /* 这里保留你原本的自定义按钮样式即可 */
}
</style>

方案2：用关联隐藏的提交按钮（无JS方案） #

如果想避免使用JavaScript，你可以用<label>标签包裹自定义元素，关联一个隐藏的原生提交按钮，点击自定义元素时就会触发隐藏按钮的提交行为：

示例代码 #

<form action="game.php?page=buildings" method="post" class="build_form">
  <input type="hidden" name="queuetype" value="1">
  <input type="hidden" name="cmd" value="fast">
  
  <!-- 隐藏的原生提交按钮 -->
  <button id="hidden-fast-reset" type="submit" style="display: none;"></button>
  
  <!-- 用label包裹自定义元素，for属性绑定隐藏按钮的id -->
  <label for="hidden-fast-reset" class="custom-reset-btn build_submit onlist tooltip" data-tooltip="花费金币重置时间">
    立即重置（消耗XX金币）
  </label>
</form>

<style>
.custom-reset-btn {
  cursor: pointer;
  /* 保留你原本的自定义按钮样式即可 */
}
</style>

注意事项 #

• 不管用哪种方案，都要给自定义元素加上cursor: pointer样式，让用户能直观感知这是可点击的交互元素。
• 如果你的自定义按钮带有tooltip这类附加交互逻辑，记得保留对应的data-*属性和相关样式/脚本，不会影响核心的表单提交功能。

内容的提问来源于stack exchange，提问作者WikStar