Google Maps API addListener方法不起作用

我使用的是Google Maps Javascript API，我希望這樣做的目的是當您點擊地圖上的按鈕時，會彈出JS警報。Google Maps API addListener方法不起作用

這裏是我的JS代碼至今：

var gmap = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 

// Setting up and adding the boundary-changing buttons             
var boundaryChangeArr = [ 
    '<h3 id="boundary-change-title">Change boundaries</h3>', 
    '<div id="boundary-change-buttons-container">', 
     '<input id="boundaries-states" class="boundary-change-button" type="button" name="StatesBoundaries" value="States" />', 
     '<input id="boundaries-counties" class="boundary-change-button" type="button" name="CountiesBoundaries" value="Counties" />', 
     '<input id="boundaries-tracts" class="boundary-change-button" type="button" name="TractsBoundaries" value="Tracts" />', 
    '</div>' 
]; 

// If there is no div with the id 'boundary-change-container', make one 
var boundaryChange = $('div#boundary-change-container'); 
if(boundaryChange.length===0){ 
    var boundaryChange = document.createElement('div'); 
    boundaryChange.id = 'boundary-change-container'; 
    boundaryChange.innerHTML = boundaryChangeArr.join(''); 
    gmap.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(boundaryChange); 
}; // DONE: if(boundaryChange.length===0) 

google.maps.event.addListener(document.getElementById('boundaries-states'), 
    'click', 
    function(){ 
     alert('clicked'); 
    });

但是，當我按一下按鈕boundaries-states，什麼也沒有發生，我甚至不看在Firebug的任何錯誤，Firefox的插件，它可以檢查JS錯誤。

我在做什麼錯？

來源

2014-06-07 Generic_User_ID

你的HTML看起來像什麼？你可以創建一個展示問題的[jsfiddle]（http://jsfiddle.net/）嗎？ – geocodezip

1.你想爲DOM對象（你的按鈕）使用addDomListener。 2.您無法使用getElementById訪問按鈕，直到它們被添加到DOM。 [jsfiddle]（http://jsfiddle.net/LxM4e/2/） – geocodezip

根據評論和重新閱讀問題，您希望單擊不在Google地圖上的按鈕時執行一些工作。在這種情況下，你不想使用google.maps.event.addListener，因爲它會監聽地圖本身的事件（如點擊）。

對於按鈕，您可以使用jQuery click事件，或者如果您使用的是不同的JavaScript框架，它們也可能會有點擊事件。 jQuery的，你會做以下幾點：

$('#boundaries-states').click(function() { 
    //Do something 
});

它看起來像addListener方法將谷歌地圖的對象，而不是爲地圖的HTML元素。看看第一個例子here。

所以，如果你沒有準備好，您會在實例化地圖需要守住參考地圖，則返回：

var map = new google.maps.Map(document.getElementById('boundaries-states'), 
    mapOptions);

一旦你有你的地圖參考，你可以添加一個使用地圖對象的偵聽器，而不是HTML元素。

google.maps.event.addListener(map, 'click', function() { 
    alert('clicked'); 
});

來源

2014-06-07 19:47:50

我忘了補充一句：我已經有一行代碼製作了Google Maps對象：'var gmap = new google.maps.Map（document.getElementById（「map-canvas」），mapOptions）;' –

好吧，對於你的情況，在調用addListener而不是'document.getElementById（'boundaries-states'）'時使用'gmap'變量。 –

在這種情況下，當我點擊地圖時會出現警報，但當我點擊'input＃boundaries-states'時不會。當我點擊'input＃boundaries-states'時，有沒有辦法讓彈出窗口彈出？ –

Google Maps API addListener方法不起作用

回答

相關問題