Question

我正从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（）;

感谢Berend提供了有用的链接。

Answer 1

事件将冒泡或捕获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?

连续2次点击地图

1 个答案: