日期:2014-05-16  浏览次数:20359 次

JSP FORM 提交
文章来源 :http://jerry8023.iteye.com/blog/518487

2009-11-16
总结:FORM中使用onSubmit="return false"防止表单自动提交,以及submit和button提交表单的区别
最近被form的自动提交烦的不行,网上搜了一些资料,下面这篇文章总结的非常全,基本好多我之前也都试过了(就差总结了^=^)。呵呵,有网友总结的这么全,就直接拿来了:)

在页面中有多个input type="text"的文本输入框的情况下没有问题,但是当页面中有只有一个文本框的情况下(),就会出现此问题.

后来在form 中添加:onsubmit="return false;"问题终于解决。

<form name="frm" method="post" onsubmit="return false;">

下边对“防止表单自动提交,以及submit和button提交表单”进行了些总结,希望对大家有些用(如果有不当的地方请指出)。

<html>
<script>

function exec(p){
    document.frm.action = p;
    document.frm.submit();
}
function exec1(p){
    document.frm.action = p;
    document.frm.submit();
    document.frm1.submit();//IE页面定位到最后一个提交的action所对应的页面
    alert("haha");//submit()后边的语句正常执行,这里弹出框文字”haha“
}
</script>
<head>
<h1>总结:FORM onSubmit="return false"防止表单自动提交,以及submit和button提交表单的区别</h1>
<head>
<body>
<!-- (1) 下边的写法使得表单frm能够自动提交
下边的这个form,将鼠标点进的文本框中然后按键盘的回车键,则页面自动进入百度页面:http://www.baidu.com
<form name='frm' action="http://www.baidu.com">
    <input type="text" name= "userName"/>
    <input type="hidden" name= "userName1"/>
</form>

注意:将上边的“<input type="hidden" name= "userName1"/>”去掉或者增加上,都不能改变页面的自动提交!
-->

<!-- (2)而同样的写法,进行如上的操作,却不会提交
可能是有两个文本输入框的缘故吧(注意:上边仅有一个)。
那如果一个页面中有多个from会怎样??后边有相关试验。

<form name='frm' action="http://www.baidu.com">
    <input type="text" name= "userName"/>
    <input type="text" name= "pass"/>
</form>
-->

<!-- (3)下面试试,同一个页面有多个from的情况
这里先试试多个form、每个form中仅有一个文本输入框
<form name='frm1' action="http://www.baidu.com">
    <input type="text" name= "userName"/>
    <input type="hidden" name= "userName1"/>
</form>
<form name='frm2' action="http://www.google.cn/">
    <input type="text" name= "userName"/>
</form>
经试验,每个from中的文本输入框都具有自动提交的能力。
-->


<!-- (4)下面试试,同一个页面有多个from的情况
这里先试试多个form、有的form中仅有一个文本输入框,有的form中则有多个文本输入框
<form name='frm1' action="http://www.baidu.com">
    <input type="text" name= "userName"/>
    <input type="text" name= "passWord"/>
</form>
<form name='frm2' action="http://www.google.cn">
    <input type="text" name= "userName"/>
</form>
<form name='frm3' action="http://www.yahoo.com">
    <input type="text" name= "userName"/>
    <input type="text" name= "passWord"/>
</form>
经试验,只有 frm2 具有自动提交的特性。

看来:只要页面中的某个表单中仅有一个文本输入框,则其页面就具有自动提交的特性了。
-->
<!--(5)如何防止页面自动提交?!
很简单!只要在from 中加上 onSubmit="return false;"就OK了!
<form name='frm1' action="http://www.baidu.com">
    <input type="text" name= "userName"/>
    <input type="text" name= "passWord"/>
</form>
<form name='frm2' action="http://www.google.cn" onSubmit="return false;">
    <input type="text" name= "userName"/>
</form>

呵呵,经过onSubmit="return false;" 改造后,frm2不再自动提交了!
-->
<!--(6)下边看看input type="submit"对提交表单的影响

这里不拿仅有一个文本框的form进行测试了(如果不用onSubmit="return false;" ,它是自动提交的)
<form name='frm1' action="http://www.baidu.com">
    <input type="tex