Loại không bắt buộcLỗi: Thuộc tính ... không phải là chức năng - sau khi trang đã tải

Question

Tôi đang sử dụng yêu cầu Ajax tên miền chéo cho API bên ngoài. Thường thì không thành công, với thông báo trên bảng điều khiển:

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

Nhìn vào JSON được trả về, nó là JSON hợp lệ, do đó, nó không phải là lỗi của API bên ngoài.

Tôi không thể tạo lại lỗi một cách đáng tin cậy: yếu tố duy nhất dường như kích hoạt lỗi là khi tôi gọi yêu cầu nhanh chóng và liên tục.

Trong trường hợp này, tôi gọi yêu cầu Ajax khi người dùng di chuyển bản đồ Google (để thêm điểm đánh dấu vào bản đồ) và điều đó xảy ra nếu người dùng di chuyển quá nhanh.

Dưới đây là những phần liên quan của mã của tôi:

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

Sau khi google một chút, lỗi Uncaught TypeError: Property 'photos' of object [object DOMWindow] is not a function nói chung dường như xảy ra khi jQuery chưa được nạp. Tuy nhiên, tôi không thấy rằng điều này có liên quan ở đây, bởi vì chức năng này được gọi từ sự kiện xếp chồng của bản đồ - và nó thường không kích hoạt lần đầu tiên, nó có xu hướng cháy sau năm hoặc sáu bản đồ thay đổi kích thước nhanh chóng . Vì vậy, nếu nó hoạt động một lần, trang chắc chắn không thể có 'lãng quên' về jQuery?

Cảm ơn lời khuyên của bạn.

Answer 1

Nếu bạn muốn xác định tên của hàm rằng jQuery tạo từ handler success của bạn, nhưng không thực sự xác định một chức năng riêng biệt để sử dụng, you should use jsonp: 'photos' instead of jsonpCallback: photos. Hiện tại, nó đang sử dụng photos trong URL có nghĩa là nó đang gọi photos({ ...data... }) khi phản hồi JSONP quay lại và điều đó không tồn tại. Sử dụng jsonp option on $.ajax() sẽ tạo ra nó. Bạn có một vài tùy chọn ở đây.

Bạn có thể làm điều này (trong một phạm vi toàn cầu) một trong hai cách sau đây:

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 
} 

Hoặc, những gì bạn dự định tôi nghĩ:

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!"); 
     } 
    }); 
} 

.... hoặc chỉ để lại cả tắt và để cho jQuery đặt tên cho chính hàm gọi lại là success (điều này xảy ra theo mặc định, dựa trên dấu thời gian).