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

Question

我有一个简单的表格，我希望人们加入它，以便被列入我的产品的等待名单 - 但它没有提交。

我的应用程序托管在本地主机：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>

有什么提示吗？ ：-(

Answer 1

您需要一个环绕输入元素和按钮的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，当单击它时，从输入中获取值，然后对该数据执行任何您想做的事情

。