謝晒的PHP網頁設計: [jQuery] Ajax 超簡單做出"loading讀取中"的效果 (可用圖示或文字)

ajax的部分，這篇就不介紹，程式碼大概如下：


$.ajax({
  url: "my_ajax.php",
  success: function(data) {
    (省略)
  }
});

如果我們希望在資料還沒傳回來之前，先在網頁上顯示"資料讀取中..."的訊息，只要下面加上以下程式碼：


$("#loading_msg").ajaxStart(function(){
  $(this).text("資料讀取中...");
});
$("#loading_msg").ajaxStop(function(){
  $(this).text();
});

如果我們希望改成轉圈圈的圖示，也只要把程式碼改成：


$("#loading_img").ajaxStart(function(){
 $(this).show();
});
$("#loading_img").ajaxStop(function(){
 $(this).hide();
});

PS.轉圈圈的圖可以在這邊下載

謝晒的PHP網頁設計