我正在为我的网络开发课程制作一份必填表格,但我似乎陷入困境。我逐字复制了课程的代码,不确定是否是浏览器问题?每当我点击注册按钮时,唯一有效的必填字段就是名字。它说“请填写该字段”。姓氏字段、电子邮件字段和密码字段没有说明这一点,尽管我将必填字段放在它们旁边。我究竟做错了什么?任何答案都会有帮助!我已经被困在这个问题上几个小时了哈哈。我尝试在每个段落之间放置一个表单操作,但这阻止了表单完全提交所需的文本。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=<device-width>, initial-scale=1.0">
<title>Register Form</title>
</head>
<body>
<h1>Race Registration!</h1>
<form action="/race_registration">
<p>
<iabel for="first">First name</iabel>
<input type="text" id="first" name="firstname" required>
<iabel for="last">Last name</iabel>
<input type="text" id="last" name="lastname" required>
</p>
<p>
<label for="select race">Select a Race:</label>
</p>
<p>
<input type="radio" name="race" id="Fun Run" value="fun run">
<label for="Fun Run">Fun Run 5k</label>
</p>
<p>
<input type="radio" name="race" id="Half value=" half">
<label for="half">Half Marathon</label>
</p>
<p>
<input type="radio" name="race" id="Full" value="full">
<label for="Full">Full Marathon</label>
</p>
<p>
<iabel for="email">Email</iabel>
<input type="email" name="email" id="email" required>
<label for="password">Password</label>
<input type="password" name="password" id="password" required>
</p>
<p>
<label for="division">Select Age Group</label>
<select name="division" id="division">
<option value="kids">Under 18</option>
<option value="ya">18-30</option>
<option value="adults">30-50</option>
<option value="senior">50+</option>
</select>
</p>
<button>Register</button>
</form>
</body>
</html>
对我来说,如果您分别从电子邮件和密码字段中删除 type="email" 和 type="password" 属性,它就会起作用。但是,我猜您可能不想删除它们。在这种情况下,您必须求助于基于 JavaScript 的表单验证。