在地圖上連續點擊兩次

我正在收集來自infowindow的用戶輸入。在infowindow上，我有一個「保存」按鈕來保存用戶的輸入。但是當我點擊那個按鈕時，我也點擊了地圖，它會讓我的標記移動到其他地方。點擊「保存」按鈕後，我只需關閉infowindow即可。我不希望我的標記移動。下面的代碼：在地圖上連續點擊兩次

<body> 
<script> 
var infowindow, marker; 
function initialize() 
{ 
var myCenter = new google.maps.LatLng(10.771654, 106.698285); 
var mapProp = { 
center: myCenter, 
zoom: 14, 
mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("googleMap"), 
    mapProp); 

    var html = "<div>Comment:<br/>" + 
      "<textarea id='text_map' cols='25' rows='4'></textarea>" + 
      "<input type='button' onclick='set_data()' value='Save'/>" + 
      "</div>"; 

    infowindow = new google.maps.InfoWindow({ 
     content: html 
    }); 

    marker = new google.maps.Marker({ 
    }); 

    google.maps.event.addListener(map, 'click', function(event)  
    {      
    var location = event.latLng;   
    marker.setPosition(location); 
    marker.setMap(map); 
     infowindow.open(map,marker);  

    }); 

    google.maps.event.addListener(marker, 'click', function() { 

     infowindow.open(map,marker);      
    }); 
} 

function set_data() 
{ 
    //do something      
    infowindow.close();      
} 
function loadScript() 
{ 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.src = "http://maps.googleapis.com/maps/api" +  
    "/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false&callback=initialize"; 
    document.body.appendChild(script); 
} 
window.onload = loadScript; 
</script> 
<div id="googleMap" style="width: 500px; height: 500px"></div> 

</body> 
</html>

奇怪的是我並沒有對IE 9，但Firefox和Chrome這個問題。

編輯：

爲了解決這個問題，我只需要停止事件傳播。以下是我的工作方式：傳遞事件作爲函數的參數set_data（）

onclick ='var event = arguments [0] || window.event; set_data（事件）」

在set_data添加這行代碼：

e.stopPropagation（）;

感謝貝倫德的有用鏈接。

來源

2013-01-01 crazy_in_love

研究stopPropagation'如何'適用於JavaScript事件 – charlietfl

感謝您的幫助！ –

事件會冒泡或捕捉到dom樹。唉，對我們來說，IE使用的不是Chrome和Firefox。請參閱http://www.quirksmode.org/js/events_order.html

如果不停止，則事件將繼續在DOM樹上向上或向下傳播。這就是你所體驗到的：點擊事件是通過按鈕，以及Chrome和Firefox中的地圖來捕獲的。由於IE使用不同的模式，IE9中不會發生這種情況。

要停止事件傳播使用：

e.stopPropagation();

該解決方案還這裏討論 How to stop event propagation with inline onclick attribute?

來源

2013-01-01 15:49:53 Berend

非常感謝！我的問題解決了。 –

在地圖上連續點擊兩次

回答

相關問題