javascript - 为 img 加载新的 src 时，jquery 不会在 403 上触发错误事件

Question

我正在尝试创建一个包含静态 Google map 的页面。调整页面大小时，我会动态更改 map 。我在一个函数中有以下代码，该函数在调整页面大小时触发，并在检查页面上元素的大小是否匹配后定期触发:

if (imageDownloadEnabled) {
   url = 'http://maps.googleapis.com/maps/api/staticmap?center=' + userLat + ',' + userLng + '&zoom=14&size=' + ((theWidth/2)|0) + 'x'+ ((theHeight/2)|0) + '&sensor=false&scale=2';
   newImage = $('<img />');
   console.log('Retrieving map from ' + url);

   newImage.error( function() { 
      console.log("error loading image");
      imageDownloadEnabled = false;
   }).load(function(eventObject) {
      console.log("done loading image");
      console.dir(eventObject);
      $('#maps-image').replaceWith(newImage);
      newImage.attr('id', 'maps-image');
   }).attr('src', url);
/**/
} else {
   console.log('disabled');
}

当 google maps api 重载时(目前发生是因为我的一个错误导致了无限循环)，我得到一个 403 错误和一个替代图像。但不会调用错误事件处理程序。

有什么办法解决这个问题吗？我想确保在出现 403 时，该页面会停止从 Google 请求新图片。

Answer 1

尝试使用.load的完整回调函数，查看textStatus值

.load($url,function(responseText, textStatus, XMLHttpRequest) {
    if(textStatus=="error") {
        //do something
    }
});