首页 > 解决方案 > 填写文本输入时,HTML 表单不会提交

问题描述

我正在制作一个表单来提交数据以登录(只是电子邮件和密码),但我已将其设置为仅隐藏电子邮件字段并在您完成输入电子邮件后将其替换为密码字段。似乎如果在电子邮件字段中输入任何内容,它将不会提交。下面有一个剪辑。

我现在实际上没有后端,它只有 HTML 和 Bootstrap,所以我不确定如何有效地解决这个问题

代码:

<form>
  <div>
    <a href="index.html"><b>QSource</b><br><span>Lorem Ipsum Dolor Sit Amet</span></a>
  </div>
  <div>
    <input type="email" id="emailField" placeholder="E-Mail">
  </div>
  <div>
    <input type="password" id="passwordField" placeholder="Password">
  </div>
  <div>
    <button type="button" onclick="next()" id="nextButton"><span>Next</span></button>
  </div>
  <div>
    <button type="submit" id="loginButton"><span>Login</span></button>
  </div>
</form>

这是我尝试提交表单的视频。请注意,如果未在电子邮件输入中输入任何内容,它将在我单击提交按钮时重新加载页面(无论密码输入中是否有任何内容)。我不确定它是否真的会提交,因为我没有后端,所以我只是想知道页面是否重新加载。

https://i.gyazo.com/4be7cad8b362d139ea4ea17dcfe50862.mp4

标签: htmlforms

解决方案


我只是没有输入有效的电子邮件地址,因此,由于输入是 type="email",它不会让它提交。


推荐阅读