ajax表單提交較慢緣由的解決辦法

ajax提交表單時，發現過了好長時間纔有反應。使用F12打開開發人員工具一看，發現提示「provisional headers are shown」。

百度了一下，才知道多是ajax異步提交和form表單默認提交的關係沒處理好，容易致使進程鎖死，進而致使反應時間比較長。

因而，借鑑了別人介紹的解決辦法「在函數中加上「event.preventDefault()」阻止默認事件和異步提交事件相沖突，問題順利解決。

（有的說 用return false，即可阻止默認事件，可是經過這個來看，有些阻止的不完全，仍是要加上event.preventDefault()）

<script src="/app/sss/view/common/js/jquery.js""></script>



 <div id="common_box">
                   <div id="cli_on"><img src="{:RES}/img/jt.png" alt=""></div>

                   <div class="gu_w" >
              
<form id="suggestForm" class="submit" method="post" action="{:url('About/feedbacks')}" name="foot_form" onSubmit="return foot_Checkfeedback();">
                          
                    <div class="">
                        <div class="gu_b">
                            <i>Inquiry title*</i>
                            &nbsp<input type="text" class="" id="intrs" name="intrs"placeholder="Must fill" />
                        </div> 
                        <div class="gu_b">
                            <i>Content*</i>
                            &nbsp<textarea name="workintrs" id="workintrs" cols="30" rows="10" class=""placeholder="Must fill" ></textarea>
                        </div>
                        <div class="gu_b ">
                            <i>Company name</i>
                            &nbsp&nbsp<input type="text" class="" id="name" name="name" />
                        </div> 
                        <div class="gu_b">
                            <i>Tel</i>  
                            &nbsp&nbsp<input type="text" class="" id="mobile" name="mobile"  />
                        </div>
                        <div class="gu_b">
                            <i>E-mail*</i> 
                           <!--  郵&emsp;&emsp;箱: -->
                            &nbsp<input type="text" class="" id="emls" name="emls" placeholder="Must fill" />
                        </div>
                        <div class="gu_c">
                         
                           <button  class=" layui-btn layui-btn-warm btn btn-warning">Submit</button>
                        </div>
                    </div>
                    </form>   
                   </div>
                  </div>
  <!-- 固定窗口 -->
<script type="text/javascript">
window.onload = function() {
 var combox = document.getElementById("common_box");
 var cli_on = document.getElementById("cli_on");
 var flag = true, timer = null, initime = null, r_len = 0;
 cli_on.onclick = function () {
  /*若是不須要動態效果，這兩句足矣
  combox.style.right = flag?'-270px':0;
  flag = !flag;
  */
  clearTimeout(initime);
  //根據狀態flag執開展開收縮
  if (flag) {
   r_len = 0;
   timer = setInterval(slideright, 10);
  } else {
   r_len = -270;
   timer = setInterval(slideleft, 10);
  }
 }
 //展開
 function slideright() {
  if (r_len <= -270) {
   clearInterval(timer);
   flag = !flag;
   return false;
  } else {
   r_len -= 5;
   combox.style.right = r_len + 'px';
  }
 }
 //收縮
 function slideleft() {
  if (r_len >= 0) {
   clearInterval(timer);
   flag = !flag;
   return false;
  } else {
   r_len += 5;
   combox.style.right = r_len + 'px';
  }
 }
 //加載後3秒頁面自動收縮
 initime = setTimeout("cli_on.click()", 100);
}
</script>
<!-- 固定窗口結束 -->   
  <!-- 表單正則 -->
  <script language='javascript'>function foot_Checkfeedback(){ 
 
  if (document.foot_form.intrs.value.trim().length == 0) {
    swal('Inquiry title cannot be empty');
    document.foot_form.intrs.focus();
    return false;}
    var email = document.foot_form.emls.value;
    var pattern = /^[a-z0-9A-Z]+[- | a-z0-9A-Z . _]+@([a-z0-9A-Z]+(-[a-z0-9A-Z]+)?\.)+[a-z]{2,}$/;
    chkFlag = pattern.test(email); if(!chkFlag){
    swal('Email is error! !');
       document.foot_form.emls.focus(); return false;}
    if (document.foot_form.workintrs.value.trim().length == 0) {
    swal('Content cannot be empty');
    document.foot_form.workintrs.focus();
    return false;}

    $.ajax({
    type: "POST",//方法
    url: "{:url('About/feedbacks')}" ,//表單接收url
    data: $('#suggestForm').serialize(),
    success: function () {
     //提交成功的提示詞或者其餘反饋代碼
     //var result=document.getElementById("success");
     //result.innerHTML="成功!";
     document.getElementById("intrs").value="";
     document.getElementById("workintrs").value="";
     document.getElementById("name").value="";
     document.getElementById("mobile").value="";
     document.getElementById("emls").value="";
     swal('success!');

    },
    error : function() {
     //提交失敗的提示詞或者其餘反饋代碼
     //var result=document.getElementById("success");
     //result.innerHTML="失敗!";
     swal('failure!')
    }
   });

     event.preventDefault();//防止起衝突，要阻止默認的行爲 return false;
    };
</script>