时间戳

首页 > 解决方案 > 为什么我的提交按钮没有提交表单数据？- HTML/节点

html - 为什么我的提交按钮没有提交表单数据？- HTML/节点

问题描述

我有一个简单的表格，我希望人们加入到我的产品的等候名单中——但它没有提交。

我的应用程序托管在 localhost:3000 上并且运行良好。页面呈现，您可以填写输入。

但是，当您单击“提交”时，它什么也不做。我尝试过几种不同的“类型”按钮，但没有运气。

这是我的代码：

<section class="waiting-list-section">
  <div class="waiting-container">
    <div class="waiting-heading">
      <h2>Join our waiting list</h2>
    </div>
    <div class="waiting-inputs">
      <label for="fName">Enter your first name</label>
      <input type="text" name="fName" value="">
      <label for="lName">Enter your surname</label>
      <input type="text" name="lName" value="">
      <label for="email">Enter your email</label>
      <input type="email" name="email" value="">
      <button class="waiting-submit-button glow" type="submit" name="submit">Join</button>
    </div>
  </div>
</section>

有小费吗？:-)

标签： html

解决方案

您需要一个form围绕输入元素和按钮的元素。

<form>
  <label for="fName">Enter your first name</label>
  <input type="text" name="fName" value="">
  <label for="lName">Enter your surname</label>
  <input type="text" name="lName" value="">
  <label for="email">Enter your email</label>
  <input type="email" name="email" value="">
  <button class="waiting-submit-button glow" type="submit" name="submit">Join</button>
</form>

第二种方法是在按钮上添加一个 eventListener，当它被点击时，从输入中获取值，然后对这些数据做任何你想做的事情

推荐阅读