html submit验证失败不提交
时间: 2023-08-02 14:39:40 浏览: 37
可以使用 JavaScript 来阻止表单提交,可以在提交事件(例如 onsubmit)中添加验证代码,如果验证失败,则可以使用 `preventDefault()` 方法来阻止表单提交。示例代码如下:
```html
<form onsubmit="return validateForm()" action="submit.php" method="post">
<input type="text" name="username">
<input type="submit" value="提交">
</form>
<script>
function validateForm() {
// 在这里添加验证代码,如果验证失败,则返回 false
if (!validateUsername()) {
return false;
}
}
function validateUsername() {
// 在这里添加验证用户名的代码
// 如果验证失败,则返回 false
var username = document.getElementsByName("username")[0].value;
if (username == "") {
alert("用户名不能为空!");
return false;
}
return true;
}
</script>
```
在上面的代码中,当用户点击提交按钮时,会触发 `validateForm()` 方法来验证表单数据。如果验证失败,则返回 false,阻止表单提交。在示例中,我们添加了一个 `validateUsername()` 方法来验证用户名是否为空,如果为空,则弹出一个提示框,并返回 false。如果验证通过,则返回 true,允许表单提交。