Maps Api v3 自定义控件不适用于 IE8答案

【问题标题】：Maps Api v3 custom control not working with IE8Maps Api v3 自定义控件不适用于 IE8
【发布时间】：2011-10-25 03:08:47
【问题描述】：

我为我的地图应用程序使用自定义控件。它适用于 FF、Safari、Chrome 和 IE9，但在 IE8 或 IE7 上似乎没有触发更改事件？这里有什么问题：

function bf_mapstyle_Control(controlDiv, map) {

  controlDiv.style.paddingTop = '5px';
  controlDiv.style.paddingRight = '20px';

  // Set CSS for the control border
  var controlUI = document.createElement('DIV');
  controlDiv.appendChild(controlUI);

  // Set CSS for the control interior
  var controlText = document.createElement('DIV');
  controlText.innerHTML = '<select id="select_mapstyle" style="font-family: Verdana,Arial,sans-serif; font-size : 12px; border: 1px solid #D8D8D8;border-radius: 3px; padding: 5px;">' + 
              '<option value="0">Google Karte</option>' +
              '<option value="1">Google Satellit</option>' +
              '<option value="2" selected>OpenStreetMap</option>' +
              '<option value="3">OpenCyleMap</option></select>';
  controlUI.appendChild(controlText);
  google.maps.event.addDomListener(controlUI, 'change', function() {
        var tid = document.getElementById('select_mapstyle').value;
        changeMapType(tid);
  });

};

function changeMapType(inType){
    switch (inType){
        case '0' : map.setMapTypeId(google.maps.MapTypeId.ROADMAP);
                 break;
        case '1' : map.setMapTypeId(google.maps.MapTypeId.HYBRID);
                 break;
        case '2' : map.setMapTypeId('OSM');
                 break;
        case '3' : map.setMapTypeId('OSM Cycle');
                 break;
    }
}

【问题讨论】：

标签： javascript google-maps

【解决方案1】：

“更改”事件不会在 IE 中使 DOM 冒泡。（我猜它可能在 IE9 中。）您必须将事件处理程序放在 <select> 元素本身上。

【讨论】：