3

当点击任何谷歌地图标记时，我需要做一些事情。我使用此链接中的演示作为起点：

http://gmap3.net/examples/tags.html

更新 - 我尝试了以下方法：

$.each(markers, function(i, marker){
  marker.click(function(){  
     alert('alert');
  });
});

$.each(markers, function(i, marker){
  $(marker).click(function(){  
     alert('alert');
  });
});

更新我尝试将此中间部分添加到现有代码中：

        $.each(markers, function(i, marker){
            marker.setMap( checked ? map : null);

           //added code begins
            $(marker).click(function(){ 
                 alert('dfd');
              });
           //added code ends

        });
4

3 回答 3

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

});

参考：https ://code.google.com/apis/maps/documentation/javascript/events.html#UIEvents

示例：http: //jsfiddle.net/diode/yXQwp/

于 2012-02-28T12:53:05.217 回答
1

请注意，OP 正在询问是否使用 GMAP3 库来执行此操作，这是一个 jQuery 插件库，在 Google 地图层之上添加了一个 API 层。说 Google API 是使用 google.maps.addListener 是绝对正确的，但我认为 OP 想要使用 addMarkers 的更接近 GMAP3 示例的东西，但要监听点击事件。考虑到这一点，我修改了 GMAP3 中的示例并将 mouseenter 事件更改为 click 事件并摆脱了 mouseleave 事件。

对于那些想进一步玩的人，我创建了这个例子的 jsFddle。

这是来源：

<!DOCTYPE HTML>
<html>
<head>
    <style>
     #map {
      width: 400px;
      height: 400px;
  }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">  </script>
<script type="text/javascript" src="http://gmap3.net/js/gmap3-4.1-min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#map').gmap3({
            action: 'init',
            options: {
                center: [46.578498, 2.457275],
                zoom: 5
            }
        }, {
            action: 'addMarkers',
            markers: [
            {
                lat: 48.8620722,
                lng: 2.352047,
                data: 'Paris !'},
                {
                    lat: 46.59433,
                    lng: 0.342236,
                    data: 'Poitiers : great city !'},
                    {
                        lat: 42.704931,
                        lng: 2.894697,
                        data: 'Perpignan ! <br> GO USAP !'}
                        ],
                        marker: {
                            options: {
                                draggable: false
                            },
                            events: {
                                click: function(marker, event, data) {
                                    var map = $(this).gmap3('get'),
                                    infowindow = $(this).gmap3({
                                        action: 'get',
                                        name: 'infowindow'
                                    });
                                    if (infowindow) {
                                        infowindow.open(map, marker);
                                        infowindow.setContent(data);
                                    } else {
                                        $(this).gmap3({
                                            action: 'addinfowindow',
                                            anchor: marker,
                                            options: {
                                                content: data
                                            }
                                        });
                                    }
                                }
                            }
                        }
                    });
});​
</script>
</head>
<body>
    <div id="map" style="width: 400x; height: 400px"></div>​
</body>
</html>

于 2012-03-01T15:22:18.357 回答
0

你的问题真的不需要太多细节，但也许你需要这样的东西：

$.each(markers, function(i, marker){
  marker.click(function(){  //maybe, its $(marker).click
     console.log(marker);
  });
});

编辑：这可以为你工作......

google.maps.event.addListener(marker, 'click', toggleBounce);

如果你用谷歌搜索那条确切的路线，你会得到更多的指示……祝你好运！

于 2012-02-28T12:01:55.007 回答