javascript当中表单提交(空格提交的问题)
表单提交(空格提交的问题)
马克- to-win:马克 java社区:防盗版实名手机尾号: 73203。
例 4.1(form.submitIEFF.html)
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script language=javascript>
function check()
{
var form = document.getElementById("regForm");
if (form.user.value == "")
{
alert("用户名不能为空!");
}
else
{
form.submit();
}
}
</script>
<form method=post id="regForm" action="jsp1.jsp">
用户<input type="text" name="user"/><br>
<INPUT TYPE="button" onclick="check();" id="regBut" value="提交"/>
</form>
马克-to-win:以上例子很好,但有个问题,当光标放在文本框里时,即使空格,回车也会提交。不信你试试,浏览器(IE和火狐)都这样。下面给出解决办法。
例 4.1_a
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script language=javascript>
function check()
{
var form = document.getElementById("regForm");
if (form.user.value == "")
{
alert("用户名不能为空!");
}
else
{
form.submit();
}
}
</script>
<form method=post id="regForm" action="jsp1.jsp">
用户<input type="text" name="user" onkeydown="if(event.keyCode==13) return false;"/><br>
<INPUT TYPE="button" onclick="check();" id="regBut" value="提交"/>
</form>
或者用下面的例子,里面用了onSubmit,只要提交,它就会被执行。
例 4.2(onSubmitReturnIEFF.html)
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script language=javascript>
function check(form)
{
/*onSubmit (Event handler)
The user has clicked on the submit button in a form.
Property/method value type: Boolean primitive
JavaScript syntax: - myObject.onsubmit = aHandler
HTML syntax: <FORM onSubmit="..."> <HTMLTag onSubmit="...">
As the <FORM> submit button is clicked, this event is triggered.If you return the value true, the event will be passed to the browser for further processing and the form will be submitted.
Returning false inhibits this action and discards the message;
the form will not be submitted. This provides a means of
inhibiting <FORM> submits when the form data is bad.
*/
if (form.user.value == "")
{
alert("用户名不能为空!");
return false;
}
return true;
}
</script>
<!-- As of version 1.1 of JavaScript, if the handler returns the Boolean false value then the browser will not follow the link to its HREF. If a true value is returned then it will.
-->
<a href="http://www.baidu.com" onClick="return false;">百度不跳转</a>
<!--
Window.confirm() (Method)
Present a confirmation dialog box.
Property/method value type: Boolean primitive
JavaScript syntax: - myResult = confirm(aString)
- myResult = myWindow.confirm(aString)
Argument list: aString Some text to explain what is to be confirmed
-->
<a href="http://www.baidu.com" onClick="return confirm('是否转向?');">百度</a>
<form method=post onSubmit="return check(this);" action="jsp1.jsp">
用户名:<input type="text" name="user"/><br>
<INPUT TYPE="submit" value="提交"/>
</form>
例 4.3(onSubmitReturn1IEFF.html)
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script language=javascript>
function check(event)
{
var event = event||window.event;
/*火狐用event.target,ie用event.srcElement,注意是表单的提交方法,target.onsubmit= check;,所以event.target是表单。*/
var form =event.srcElement||event.target;
if (form.user.value == "")
{
alert("用户名不能为空!");
return false;
}
return true;
}
</script>
<form method=post id="register" name="register" action="jsp1.jsp">
用户名:<input type="text" name="user"/><br>
<INPUT TYPE="submit" value="提交"/>
</form>
<script>
var target = document.getElementById("register");
target.onsubmit = check;
</script>