任何谷歌地图标记的JavaScript点击事件
JavaScript click event for any google maps markers?
当点击任何谷歌地图标记时,我需要做一些事情。我使用这个链接的演示作为起点:
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
});
google.maps.event.addListener(marker, 'click', function() {
});
参考:https://code.google.com/apis/maps/documentation/javascript/events.html#UIEvents
示例:http://jsfiddle.net/diode/yXQwp/
请注意,OP正在询问如何使用GMAP3库来完成这项工作,GMAP3库是一个jQuery插件库,它在Google地图层的顶部添加了一个API层。说Google API使用Google.maps.addListener是完全正确的,但我认为OP想要使用addMarkers更接近GMAP3示例的东西,但要听click事件。考虑到这一点,我修改了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>
你的问题确实不需要太多细节,但也许你需要这样的东西:
$.each(markers, function(i, marker){
marker.click(function(){ //maybe, its $(marker).click
console.log(marker);
});
});
编辑:这对你有用。。。
google.maps.event.addListener(marker, 'click', toggleBounce);
如果你在谷歌上搜索那一行,你会得到更多的指针。。。祝你好运
相关文章:
- 如何将javascript事件从web浏览器wpf控件发送到wpf的c#代码
- 在同一个javascript事件处理程序中调用不同的函数
- Javascript事件;在新选项卡中打开”;
- 存在每个时间元素的javascript事件
- Javascript事件.锚的目标问题
- 带有参数的Javascript事件处理程序
- 如何从另一个处理程序内部取消JavaScript事件处理程序函数的执行
- firefox中的Javascript事件范围问题
- Firefox中的JavaScript事件参数
- 在动态加载的PHP表单上放置JavaScript事件
- 如何在Javascript事件上从JSNI设置GWTClass字段
- Javascript事件发射器一次处理多个事件
- 在下拉式javascript事件监听器中选择时触发事件
- 在javascript中导入xlsx文件时,如何手动强制javascript事件
- 显示触发的JavaScript事件
- 正在取消IE11中的JavaScript事件
- 页面卸载期间的JavaScript事件循环
- 存在其他参数时访问Javascript事件
- 阻止Javascript事件影响子元素
- 如何在事件处理程序中获取 javascript 事件对象