$(document).ajaxstart 没有触发答案

【问题标题】：$(document).ajaxstart not firing$(document).ajaxstart 没有触发
【发布时间】：2012-04-29 23:09:36
【问题描述】：

我有两个调用 $.getJSON 的函数——一个查看存储在服务器上的 JSON，另一个调用 Flickr。

我有这个：

$(document).ajaxStart(function(){ 
        alert('requeststart');
        //$('#loading').show(); 
    });

当使用某个给定路径调用 $.getJSON 时有效，但当 $.getJSON 调用 Flickr 时它不会引发警报。 Flickr 调用有效，并且所有内容都按应有的方式加载……但是它不会触发 ajaxStart。（我使用 ajaxStart 和 ajaxStop 来显示 loading-gif）

有什么想法吗？

这是调用 Flickr 的函数：

$('#submit').on("click", function (evt) {
    evt.preventDefault();
    var tag = $('input').val();
    if (tag == "") {
        alert("please enter a tag");
    }
    else {
      $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",{tags: tag, tagmode: "any", format: "json" },
      function(data) {
        $.each(data.items, function(i,item){
            var name = names[index];
            $("#" + name).empty();
            $('<img src="' + item.media.m.replace("_m.jpg", ".jpg") + '" />').appendTo("#" + name);
            $('<a href="' + item.link + '"> ' + item.title + '</a>').appendTo("#" + name );
            index ++;
            if (i==5) { 
                index = 0;
                }       
        });
      });
    }
});

【问题讨论】：

一个jsfiddle 会很好。

标签： ajax jquery flickr

【解决方案1】：

只有在内部使用XMLHttpRequest 对象时，jQuery 才会触发这些事件（ajaxStart 和ajaxStop）。

但是，如果您使用回调参数 (JSONP) 从不同域请求数据，则 jQuery 不会使用 XMLHttpRequest，而是通过插入 <script> 标记来实现。

这就是事件没有被触发的原因。

作为一种解决方法，您可以在 $.getJSON 调用之前开始加载动画，并将其停止在 function(data) {.. 块内。

【讨论】：

【解决方案2】：

对于多重请求，您必须单独计算它们。我是这样做的：

var loader = 0;       
function showloader(cnt){
    loader = loader + cnt;
     if(loader < 1) {
        $('#loading').hide();
      } else {
        $('#loading').show();
      }
}

增加 1 并在 $.getJSON 之前调用它并减少它并在完成后再次触发。喜欢：

showloader(1);
$.getJSON( 
   [...] 
 }).done(function() { 
   showloader(-1);
   [...]
});

【讨论】：