📅  最后修改于: 2023-12-03 15:38:47.564000             🧑  作者: Mango
在HTML中,可以通过设置 "required" 属性来指定必须在提交表单之前填写的输入字段。下面是如何使用此属性:
<form>
<input type="text" name="name" required>
<input type="email" name="email" required>
<input type="submit" value="Submit">
</form>
上述代码中,在 <input>
元素中添加了 "required" 属性,这将强制用户在表单提交之前填写这些输入字段。
如果想要根据代码逻辑来添加 "required" 属性,可以使用 JavaScript 来实现。
例如,以下代码检查了表单中是否填写了 "name" 和 "email" 字段,并将它们标记为必须填写的字段:
<form>
<input type="text" name="name">
<input type="email" name="email">
<input type="submit" value="Submit" onclick="checkForm(event)">
</form>
<script>
function checkForm(event) {
var nameInput = document.getElementsByName('name')[0];
var emailInput = document.getElementsByName('email')[0];
if (!nameInput.value.trim()) {
nameInput.setCustomValidity('Please enter your name');
event.preventDefault();
} else {
nameInput.setCustomValidity('');
}
if (!emailInput.value.trim()) {
emailInput.setCustomValidity('Please enter your email');
event.preventDefault();
} else {
emailInput.setCustomValidity('');
}
}
</script>
上述代码中,JavaScript 代码会在用户点击提交按钮时运行。它会检查每个输入字段是否为空,如果为空,则将其标记为必填字段,并阻止表单提交。如果输入字段不为空,则取消必填标记。