JS解决在提交form表单时某个值不存在 alter弹窗点确定不刷新界面
时间: 2024-03-07 11:46:44 浏览: 27
你可以在提交表单时使用 JavaScript 来检查所有的输入值是否存在,如果某个值不存在,可以使用 `event.preventDefault()` 方法来阻止表单的默认提交行为,然后使用 `window.alert()` 方法来弹出提示框。当用户点击提示框的确定按钮时,你可以继续执行表单的提交操作。以下是一个示例代码:
```html
<form onsubmit="return checkForm(event)">
<input type="text" name="username">
<input type="password" name="password">
<button type="submit">提交</button>
</form>
<script>
function checkForm(event) {
var username = document.getElementsByName("username")[0].value;
var password = document.getElementsByName("password")[0].value;
if (!username || !password) {
event.preventDefault();
window.alert("请填写完整的用户名和密码!");
return false;
}
// 执行表单的提交操作
return true;
}
</script>
```
在上面的示例代码中,`checkForm()` 函数会在表单提交时被调用。它首先获取用户名和密码的输入值,然后判断它们是否存在。如果存在则返回 `true`,允许表单的提交操作;如果不存在,则阻止表单的默认提交行为,弹出提示框,并返回 `false`。当用户点击提示框的确定按钮时,表单会继续提交。