下拉菜單不適用於Chrome瀏覽器，只能在Firefox上使用

Question

我使用GMap上的下拉列表選擇需要的區域。它只適用於Firefox，在其他瀏覽器中，當我選擇區域時，它什麼都不做。這裏是我的代碼：

  $.getJSON("sample2.php", {}, function(data){ 
      $.each(data.places2, function(i, item){ 

       // $("#markers1").append('<li><a href="#" rel="' + i + '">' + item.title2 +    '</a></li>'); 
     $("#markers").append('<option value="' + i+ '">' + item.title2 +'</option>'); 
     latlngbounds2.extend(new google.maps.LatLng(item.lat2, item.lng2)); 
     map.setCenter(latlngbounds2.getCenter(), map.fitBounds(latlngbounds2)); 
     var marker2 = new google.maps.Marker({ 
      position: new google.maps.LatLng(item.lat2, item.lng2), 
      title: item.title2 
      // map: map 
     }); 
     arrMarkers2[i] = marker2; 
     var infowindow2 = new google.maps.InfoWindow({ 
      content: "<h3>"+ item.title2 +"</h3>" +"<p>" 
     }); 
     arrInfoWindows2[i] = infowindow2; 
    }); 
}); 
} 
    $(function (){ 

mapInit(); 

    // $('#markers option').click(function() { 
    $("#markers option").live("click", function(){ 
    var i = $(this).attr("value"); 
    // Эта строка кода, закрывает все открытые балуны, для открытия выбранного 
    for(x=0; x < arrInfoWindows2.length; x++){ arrInfoWindows2[x].close(); } 
    //arrInfoWindows2[i].open(map, arrMarkers2[i]); 
    map.setZoom(12); 
    map.setCenter(arrMarkers2[i].getPosition()); 
    // alert(arrMarkers2[i]); 
    console.info(arrMarkers2[i]['title']); 

}); 
}); 

這是HTML代碼：

 <div name="cont" id="container" > 
    <select id="markers"> 
    <option>Select Region</option> 
    </select> 
     </div> 

任何人可以幫助？

Answer 1

您是否嘗試在下拉菜單中使用change而不是click？

$("#markers").change(function() { 
    var i = $(this).val(); 

    for (x=0; x < arrInfoWindows2.length; x++) { 
     arrInfoWindows2[x].close(); 
    } 

    map.setZoom(12); 
    map.setCenter(arrMarkers2[i].getPosition()); 
    console.info(arrMarkers2[i]['title']); 
});