Hiển thị hình ảnh tải với getJSON

Question

Tôi muốn sử dụng hình ảnh tải trong khi truy xuất dữ liệu qua AJAX bằng getJSON. Tôi đã nhìn xung quanh nhưng chưa tìm được cách thích hợp để làm điều này. Cách tốt nhất để làm việc này là gì?

$.getJSON('file.php', function(json) { 
    $.each(json, function() { 

    // Retrieving data from json... 

    }); 
}); 

Answer 1

Hiện spinner trước getJSON cuộc gọi và sau đó ẩn sau phản ứng được phân tách

$(".someSpinnerImage").show(); 
    $.getJSON('file.php', function(json) { 
     $.each(json, function() { 
      // Retrieving data from json... 

     }); 
     $(".someSpinnerImage").hide(); 
    }); 

Answer 2

bạn có thể configure cho sử dụng toàn cầu, nó sẽ được nội gọi bất cứ khi nào một ajax cuộc gọi được thực hiện.

$.ajaxStart(function() { 
    $("img#loading").show(); 
}); 

$.ajaxComplete(function() { 
    $("img#loading").hide(); 
}); 

Answer 3

.ajaxStart() documentation nói:

Tính đến jQuery 1.9, tất cả các bộ xử lý cho các sự kiện Ajax toàn cầu jQuery, bao gồm những chất được thêm với phương pháp .ajaxStart(), phải được đính kèm tài liệu.

Nếu $.ajax() hoặc $.ajaxSetup() được gọi với tùy chọn toàn cầu đặt sai, phương pháp .ajaxStart() sẽ không cháy.