www.javainfo.com.cn 上干货 欢迎收藏

遇到的问题，form表单提交后，其界面肯定会跳转，这个问题是实际工作中可用遇到的问题，那么有什么比较好的解决方法吗？

这里不谈 ajax 异步提交表单功能，只谈谈没有脚本提交的情况下 我们有什么比较好的方式处理这个问题呢？

form表单的优势： 可用随便的跨域提交数据  且安全性高

实际应用：解决思路如下： 

 1  form提交到后台 携带者form表单页面的路径（uri： http：//xxxxxx/form.html)

 2  服务器段处理数据，  获取表单的页面URI数据， 重定向到form.html界面 且携带一个数据已经处理的字段 html?check=1

 3  在form.html界面使用脚本处理服务器段携带回来的数据 check, 检查check是否存在 （这样我们可用盘点数据是否提交）

    若数据存在，则提示【数据已经提交，系统正在调整，请确认... ... 】， 点击确认后，剔除URI 上的check字段 将界面重新刷新到form.html;

4 完结。

代码开始：

  form.html:

   

             <form action="http://www.test.cn/sendmail.jspx" method="post" id="Sendemail" >

                                <input type="hidden" name="rs" id="rs"/>       

<table width="100%" border="0" cellpadding="5" cellspacing="1" class="table_list">

 <tr>

<td colspan="2" class="td_bg2" align="center" width="100%" height="30px;">

 <h3>目的邮箱（xxxxx@163.com）</h3>

</td>

 </tr>

                                  <tr class="td_bg3">

     <td colspan="2" align="center">

      <input name="" type="button" value="发送邮件" id="push"  />  

     </td>

 </tr>

</table>

 </form>

           <script>

                //页面脚本

                function ieSendMail() {     

                  document.getElementById('push').onclick = (function () {  

                   document.getElementById("Sendemail").submit();

                  });

                }

                //判断是否是IE浏览器，包括Edge浏览器

                function IEVersion() {

                  var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串

                  var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE浏览器

                  var isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0;") > -1 && !isIE;//判断是否IE的Edge浏览器

                  if (isIE) {

                    var reIE = new RegExp("MSIE (\\d+\\.\\d+);");

                    reIE.test(userAgent);

                    var fIEVersion = parseFloat(RegExp["$1"]);

                    if (fIEVersion == 7 || fIEVersion == 8 || fIEVersion == 9) {

                      ieSendMail();

                      return "IE7||IE8||IE9";

                    } else if (fIEVersion == 10 || fIEVersion == 11) {

                      ieSendMail();

                      return "IE10||IE11";

                    } else {

                      return "0";

                    } //IE版本过低

                  } else if (isEdge) {

                    ieSendMail();

                    return "Edge";

                  } else {

                    ieSendMail();

                    return "-1"; //非IE

                  }

                }

                IEVersion();

            

                   function getUrlParam(name) {

                        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); 

                        var r = window.location.search.substr(1).match(reg);  

                        if (r != null) return unescape(r[2]); return null; 

                    }

                     //获取服务器端 返回的数据， 判断有无   

                     //无 则代表  页面尚未提交， 有则表示页面已经提交 服务器已经返回数据

                     //这里返回的数据也可用 复杂一些  例如处理失败等各种例外情况。

                  var res = getUrlParam('tt');

             if(res != '' && res != null){

                             //这里可用做友好提示

                             alert('提交成功,请确认 ... ... ');

                             //讲界面重定向到form初始化的界面 避免刷新重复提交表单

                  window.location.href='http://xxxxxxx/form.html';

             }

                     //讲form.html的页面路径保存在表单的字段里

                    document.getElementById("rs").value = window.location.href;

              </script>

java后台处理代码：

 

        @RequestMapping(value = "/sendmail.jspx", method = RequestMethod.POST)

public void OtherSendMainJTJ(String rs

,HttpServletResponse response){

 //发送邮件功能 。。。

try {

System.out.println("jtj send ok  redirect .. .. .. ");

                        //tt则是服务器端返回给客户端的数据   这个数据需要 在客户端处理

response.sendRedirect(rs+"?tt=1");

} catch (IOException e) {

e.printStackTrace();

}

return ; 

}

如有疑问 请留言 欢迎提供建议