未捕获的类型错误：属性...不是函数 - 页面加载后

我正在使用对外部 API 的跨域 Ajax 请求。有时它会失败，并显示控制台消息：

Uncaught TypeError: Property 'photos' of object [object DOMWindow] is not a function

查看返回的 JSON，它是有效的 JSON，因此不是外部 API 的错误。

我无法可靠地重现错误：似乎触发错误的唯一因素是当我快速且重复地调用请求时。

在本例中，当用户移动 Google 地图（向地图添加标记）时，我将调用 Ajax 请求，如果用户移动得太快，就会发生这种情况。

以下是我的代码的相关部分：

// Code located inside an external JS file referenced inside the head
// Not wrapped inside document.ready - but all the code setting up 
// the map (calling a function which calls a function which adds the 
// tilesloaded listener) *is* inside document.ready
function addMarkers() {
    var pm_url = "http://www.cyclestreets.net/api/photos.json?key=" + MY_KEY;
    $.ajax({
       url: pm_url,
       crossDomain: true, 
       contentType: "application/json",
       dataType: 'jsonp',
       data: pmdata,
       jsonpCallback: 'photos',
       success: function(data) {
        // TBA
       },
       error: function() {
           alert("Sorry, error retrieving photos!");
       }
   });
}
 google.maps.event.addListener(map, 'tilesloaded', function() {
 addMarkers(map);
 });

谷歌搜索了一下，错误Uncaught TypeError: Property 'photos' of object [object DOMWindow] is not a function通常似乎发生在 jQuery 尚未加载时。

然而，我不认为这与这里相关，因为该函数是从地图的tilesloaded事件调用的 - 它通常不会第一次触发，它往往会在五六次快速调整地图大小后触发。因此，如果它运行一次，页面肯定不会“忘记”jQuery 吗？

谢谢你的建议。

如果您想指定namejQuery 从您创建的函数的success处理程序，但没有实际定义使用一个单独的函数, 你应该使用jsonp: 'photos'代替jsonpCallback: photos http://api.jquery.com/jQuery.ajax/。目前正在使用photos在 URL 中，这意味着它正在调用photos({ ...data... })当 JSONP 响应返回时，它不存在。使用jsonp选项开启$.ajax() http://api.jquery.com/jQuery.ajax/会创造它。您在这里有几个选择。

您可以通过以下两种方式之一（在全局范围内）执行此操作：

function addMarkers() {
    var pm_url = "http://www.cyclestreets.net/api/photos.json?key=" + MY_KEY;
    $.ajax({
       url: pm_url,
       crossDomain: true, 
       contentType: "application/json",
       dataType: 'jsonp',
       data: pmdata,
       jsonpCallback: 'photos',
       error: function() {
           alert("Sorry, error retrieving photos!");
       }
   });
}
function photos(data) {
    // TBA
}

或者，我认为你的意图是：

function addMarkers() {
    var pm_url = "http://www.cyclestreets.net/api/photos.json?key=" + MY_KEY;
    $.ajax({
       url: pm_url,
       crossDomain: true, 
       contentType: "application/json",
       dataType: 'jsonp',
       data: pmdata,
       jsonp: 'photos',
       success: function(data) {
        // TBA
       },
       error: function() {
           alert("Sorry, error retrieving photos!");
       }
   });
}

....或者只是保留两者并让 jQuery 命名success回调本身（默认情况下会发生这种情况，基于时间戳）。