Điều gì gây ra lỗi Google Maps trong IE8?

Question

Chúng tôi đang sử dụng Google Maps và đã xác định được sự cố chỉ xảy ra trong IE8 (và có thể bên dưới). Chức năng hoạt động chính xác trong FF, Chrome, IE9.

Mã rằng lỗi xảy ra xung quanh là:

google.load("maps", "3.x", { other_params: "sensor=false" }); 
    var mapdiv = null; 
    $(function() { 
     mapdiv = document.getElementById("map"); 
     map = new google.maps.Map(mapdiv, { 
      zoom: 1, 
      center: new google.maps.LatLng(6, 35), 
      disableDefaultUI: true, 
      mapTypeId: google.maps.MapTypeId.TERRAIN 
     }); 
     var latlngbounds = new google.maps.LatLngBounds(); 

Đặc biệt trên dòng này:

map = new google.maps.Map(mapdiv, { 
    zoom: 1, 
    center: new google.maps.LatLng(6, 35), 
    disableDefaultUI: true, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
}); 

và lỗi này là:

Object không hỗ trợ này thuộc tính hoặc phương pháp

Tôi đã có một chút chơi với các công cụ phát triển IE và nếu tôi thay thế map = với một cái gì đó như var x = không có lỗi nào, vì vậy điều này dẫn tôi tin rằng đối tượng map là thủ phạm thiếu một số thuộc tính/phương pháp . Mặc dù tôi không thực sự biết nơi đối tượng map xuất phát từ, tôi cho rằng nó được tải từ cuộc gọi google.load.

Có ai biết điều gì đang xảy ra ở đây không?

Answer 1

Khi dòng:

map = new google.maps.Map(mapdiv, { zoom: 1, center: new google.maps.LatLng(6, 35), disableDefaultUI: true, mapTypeId: google.maps.MapTypeId.TERRAIN }); 

được thực hiện thông dịch JavaScript sẽ bắt đầu đi qua lên chuỗi phạm vi tìm kiếm nơi map được khai báo. Vì nó không được khai báo cục bộ, tức là var map = ..., nó không tìm thấy nó trong phạm vi địa phương của bạn, và nó cuối cùng được thêm vào phạm vi toàn cầu.

Trong trường hợp của bạn map đã được xác định trong phạm vi toàn cầu là window.map bởi vì, đó là Id của số div trên trang của bạn. Trong tất cả các trình duyệt bạn không thấy thông báo lỗi, window.map được đặt thành đối tượng google.maps.Map mới. Đối với một số lý do, tốt hay xấu, IE8 sẽ không cho phép bạn tạo một biến toàn cục có tên xung đột với một biến toàn cục hiện có đề cập đến một phần tử DOM.

Bạn có thể giải quyết này theo nhiều cách khác nhau:

1. Tạo một địa phương var map
2. Thay đổi id của div của bạn từ map đến cái gì khác

3. Nếu bạn phải có map tồn tại trong phạm vi toàn cầu , đặt nó bằng cách sử dụng window.map =...

   (3b) Thay đổi tên biến thành một tên không xung đột với window.map, ví dụ: myMap = new google.maps.Map(...