Jquery ajax載入等待執行結束再繼續執行下面程式碼操作

hover_lew發表於2019-02-16

Jquery等待ajax執行完畢再繼續執行下面程式碼的效果,具體程式碼如下,其實就是將 jquery ajax 函式的 async 引數設定為 false 即可,該引數預設為 true:

$(document).ready(function(){ 
  loadphpernote(); 
  window.open(`http://www.phpernote.com`); 
}); 
function loadphpernote(){ 
  var url=`http://www.phpernote.com/ajax.php`; 
  var data=`action=list`; 
  jQuery.ajax({ 
    type:`post`, 
    url:url, 
    data:para, 
    async:false,//false代表只有在等待ajax執行完畢後才執行window.open(`http://www.phpernote.com`)語句 
    success:function (msg){ 
      $(`#articleList`).html(msg); 
    } 
  }); 
}

下面給大家介紹jquery 載入等待效果

var dates = this.options.form.getWidgetByName("dates").getValue(); 
 $.ajax({  
  url: "http://127.0.0.1:9009/Brilliantzz/service/snproduct.do",  
  data:dates, 
beforeSend:function() { 
   var h = document.body.clientHeight;  
 $("<div class="datagrid-mask"></div>").css({display:"block",width:"100%",height:h}).appendTo("body");  
 $("<div class="datagrid-mask-msg"></div>").html("正在上傳生產資料,請稍候。。。").appendTo("body").css({display:"block", 
 left:($(document.body).outerWidth(true) - 190) / 2, 
 top:(h - 45) / 2}); 
  }, 
complete:function(data) { 
     $(`.datagrid-mask-msg`).remove(); 
  $(`.datagrid-mask`).remove(); 
  }, 
  success: function(data) { 
    alert("生產資料:"+data);   
  }, 
  error: function(data) { 
       alert("上傳生產資料異常!"); 
      } 
    });

相關文章