怎么实现表单提交后不重新刷新当前页面

如何实现表单提交后不重新刷新当前页面

<form name='form1' id='form1' action='/xbcw/cw/xx_xx.action' method='post'>

　　<input type="button" id="btnSubmit" name="btnSubmit" value="保存" οnclick="addKp()" class="Button2" />

　　<input type="button" id="btnSubmit" name="btnSubmit" value="下一步" οnclick="doAddCwKpSubmit()" class="Button2" />

</form>

当我点击保存提交FORM表单后,如何让当前页面维持不变(即不刷新当前页)？

在FORM表单后添加一个iframe

　　<iframe id="rfFrame" name="rfFrame" src="about:blank" style="display:none;"></iframe> 

点保存提交事件里面需要将target改为iframe的名字:

　　JS:document.forms[0].target="rfFrame";

JQuery:$("#f2").attr("target","rfFrame");

这样即提交了FORM保存了数据,页面也不会跳转.

例子1：

1. <script type="text/javascript">  
2.     function sub() {  
3.         // jquery 表单提交   
4.         $("#formId").ajaxSubmit(function(message) {   
5.         // 对于表单提交成功后处理，message为返回内容   
6.         });   
7.   
8.         return false; // 必须返回false，否则表单会自己再做一次提交操作，并且页面跳转   
9.     }   
10.   
11. </script>  
12. <form id="formId" action="servlet" method="post"onsubmit="return sub();">   
13.     <input type="submit" value="提交"/>   
14. </form>   

例子2：

1. <script type="text/javascript">  
2.     function sub() {  
3.         $.ajax({  
4.                 cache: true,  
5.                 type: "POST",  
6.                 url:"Servlet",  
7.                 data:$('#formId').serialize(),// 你的formid  
8.                 async: false,  
9.                 error: function(request) {  
10.                     alert("Connection error:"+request.error);  
11.                 },  
12.                 success: function(data) {  
13.                     alert("SUCCESS!");  
14.                 }  
15.             });  
16.     }  
17. </script>  
18. <form id="formId" action="servlet" method="post"onsubmit="return sub();">  
19.     <input id="input1" />   
20.     <input id="input2" />   
21.     <input id="input3" />  
22.     <input type="button" value="提 交" onclick="sub()"/>  
23. </form>