未捕获的类型错误：属性...不是一个函数 - 页面加载后 [英] Uncaught TypeError: Property ... is not a function - after page has loaded

问题描述

我使用的跨域Ajax请求外部API。几乎每隔一段时间失败，与控制台消息：

I'm using a cross-domain Ajax request to an external API. Every so often it fails, with the console message:

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

综观JSON返回，这是有效的JSON，所以它不是外部API的故障。

Looking at the JSON being returned, it is valid JSON, so it is not the fault of the external API.

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

I can't reproduce the error reliably: the only factor that seems to trigger the error is when I call the request quickly and repeatedly.

在这种情况下，我打电话Ajax请求，当用户移动谷歌地图（添加标记到地图），如果用户左右移动太快发生。

In this case I'm calling the Ajax request when the user moves a Google map (to add markers to the map), and it occurs if the user moves around too quickly.

下面是我的code中的相关部分：

Here are the relevant parts of my code:

// 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);
 });

已经用Google搜索了一下，误差未捕获的类型错误：对象属性照片[对象DOMWindow]是不是一个函数一般似乎发生时的jQuery尚未加载。

Having Googled a bit, the error Uncaught TypeError: Property 'photos' of object [object DOMWindow] is not a function generally seems to occur when jQuery has not been loaded.

不过，我不认为这是与此有关，因为该功能是从地图的tilesloaded事件调用 - 它一般不火的第一​​次，也容易解雇五六快速的地图调整大小后。所以，如果它的工作原理一次，页面肯定不能有被遗忘的关于jQuery的？

However, I don't see that this is relevant here, because the function is called from the map's tilesloaded event - and it doesn't generally fire the first time, it tends to fire after five or six rapid map resizes. So if it works once, the page surely can't have 'forgotten' about jQuery?

谢谢你的建议。

推荐答案

如果你想指定的名称的jQuery从成功创建功能的处理程序，但实际上没有定义的一个单独的函数中使用的，你应该使用 JSONP：照片，而不是的jsonpCallback：照片 。目前，它的使用照片中，这意味着它的调用网址照片（{...数据...}）时，所述JSONP响应返回，并且不存在。在使用 JSONP 选项$。阿贾克斯（） 会创建它。你有几个选择这里。

If you want to specify the name of the function that jQuery creates from your success handler, but not actually define a separate function to use, you should use jsonp: 'photos' instead of jsonpCallback: photos. Currently it's using photos in the URL which means it's calling photos({ ...data... }) when the JSONP response comes back, and that doesn't exist. Using the jsonp option on $.ajax() would create it. You have a few options here.

您可以做到这一点（在全球范围内），这两种方式：

You can do this (in a global scope) either of these two ways:

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
}

或者，你有什么打算，我认为：

Or, what you intended I think:

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的名称成功回调本身（这是默认情况下，基于时间戳）。

....or just leave both off and let jQuery name the success callback itself (this happens by default, based on a timestamp).

这篇关于未捕获的类型错误：属性...不是一个函数 - 页面加载后的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！