jQuery .on（）select

Question

jQueryを使用して、選択メニューで選択したオプションに応じてカスタムマップを変更しようとしています。現在、私は次のようしている：

<select> 
     <option lat="37.0902" lng="95.7129" class="country1" zoom="4" map_id="1" value="us">United States</option> 
</select> 

私はそれがイメージだったと私はホバリング必要であれば、jQueryのは、それは次のようになり、処理することを意図していることを認識だ：

jQuery('body').on('mouseenter', 'country1', function(event, ui) { 
    var mid = jQuery(this).attr('map_id'); 
    var mlat = jQuery(this).attr('lat'); 
    var mlon = jQuery(this).attr('lng'); 
    var mzoom = jQuery(this).attr('zoom'); 
    var myLatLng = new google.maps.LatLng(mlat,mlon); 
    MYMAP[mid].map.setCenter(myLatLng); 
    MYMAP[mid].map.setZoom(mzoom); 
}); 

しかし、私はわかりませんよインタラクティブオブジェクトが画像ではなく選択メニューであるシナリオで何をするか。ありがとうございました！

Answer 1

変更イベントを使用します。

参照

<select id="country"> 
    <option lat="37.0902" lng="95.7129" class="country1" zoom="4" map_id="1" value="us">United States</option> 
</select> 

のためのあなたの選択にIDやクラスを追加し、その後にあなたのjavascriptを変更します。.country1' '`.`は`べきである行方不明country1'`'

$('#country').change(function(event, ui) { 
    var mid = jQuery(this).attr('map_id'); 
    var mlat = jQuery(this).attr('lat'); 
    var mlon = jQuery(this).attr('lng'); 
    var mzoom = jQuery(this).attr('zoom'); 
    var myLatLng = new google.maps.LatLng(mlat,mlon); 
    MYMAP[mid].map.setCenter(myLatLng); 
    MYMAP[mid].map.setZoom(mzoom); 
});