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

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

　　

　　

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

在FORM表单后添加一个iframe

　　 

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

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

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

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

例子1：

 <script type="text/javascript">
     function sub() {
         // jquery 表单提交
         $("#formId").ajaxSubmit(function(message) {
         // 对于表单提交成功后处理，message为返回内容
         });

         return false; // 必须返回false，否则表单会自己再做一次提交操作，并且页面跳转
     }

 script>
 <form id="formId" action="servlet" method="post"onsubmit="return sub();">
     <input type="submit" value="提交"/>
 form>

例子2：

 <script type="text/javascript">
     function sub() {
         $.ajax({
                 cache: true,
                 type: "POST",
                 url:"Servlet",
                 data:$('#formId').serialize(),// 你的formid
                 async: false,
                 error: function(request) {
                     alert("Connection error:"+request.error);
                 },
                 success: function(data) {
                     alert("SUCCESS!");
                 }
             });
     }
 script>
 <form id="formId" action="servlet" method="post"onsubmit="return sub();">
     <input id="input1" />
     <input id="input2" />
     <input id="input3" />
     <input type="button" value="提 交" onclick="sub()"/>
 form>