我的目的:如果用户字段和密码字段为空,我想停止表单提交.这是我正在尝试的代码:
<!DOCTYPE html>
<html>
<head>
<script>
function doit() {
var usr = document.getElementById('ur').value;
var psw = document.getElementById('pw').value;
if ((usr.trim() == '') && (psw.trim() == '')) {
alert("cannot Submit form");
return false;
}
}
</script>
</head>
<body>
<form action="post.php" method="post" onsubmit="doit()">
User:
<input type="text" id="ur" name="user">
<br>
<br> Pass:
<input type="password" id="pw" name="pass">
<br>
<br>
<button>Submit</button>
</form>
</body>
</html>
我正在学习JavaScript.如果你纠正代码并稍微解释为什么它不起作用将会有所帮助.
Han*_*nky 55
return false工作正常,你调用该函数的方式是错误的.
<form action="post.php" method="post" onsubmit="doit()">
只是调用它,不对返回值做任何事情
<form action="post.php" method="post" onsubmit="return doit()">
^
将在错误的返回值上停止表单发布.
在MSDN上阅读此说明,尽管它不是IE特定的
您可以通过在事件处理程序中返回false来覆盖此事件.使用此功能验证客户端上的数据,以防止将无效数据提交到服务器.如果事件处理程序由表单对象的onsubmit属性调用,则代码必须使用return函数显式请求返回值,并且事件处理程序必须为事件处理函数中的每个可能的代码路径提供显式返回值.
现在转到另一个重点.
if当两个字段都为空时,您的条件将仅停止表单提交,而即使这两个字段中的任何一个为空,它也应该这样做.那个&&(AND)应该是||(OR),并且如果没有返回false,return true则在函数结束时.
Dan*_*elo 10
onsubmitevent接受布尔值,因为您没有返回任何内容,因此默认情况下它为true.您需要在此事件中添加返回.
更改
onsubmit="doit()">
至
onsubmit="return doit()">
在使用 preventDefault() 提交时使用 addEventListener
document.form1.addEventListener( "submit", function(event) {
var user = this.querySelector("input[name=user]").value; // this = object of form1
var pass = this.querySelector("input[name=pass]").value;
if ( (user.trim() == "") || (pass.trim() == "") ) {
alert("cannot Submit form");
event.preventDefault();
} else {
alert("submit");
}
} );<form action="" method="post" name="form1" >
Username: <input type="text" name="user" /><br><br>
Password: <input type="password" name="pass" /><br><hr>
<input type="submit" value="Submit" />
</form>| 归档时间： |
|
| 查看次数： |
38169 次 |
| 最近记录： |