将 google 映射事件侦听器添加到 InfoWindows 中的自定义关闭按钮
Add google maps event listener to custom close button in InfoWindows
目前我正在尝试在 Google 地图中实现我自己的自定义信息 Windows。我找到了关于 5 ways to customize Google's InfoWindow 的非常好的教程。从教程中我已经成功创建了自己的自定义信息 Windows,但是我无法在信息 Windows.
中实现自己的关闭按钮
根据代码,我创建了自己的关闭按钮,该按钮附加到 InfoWindows' 内容。
<span id="iw-close-btn"><i class="fa fa-lg fa-times white"></i></span>
然后我使用 maps.google.event.addDomListener() 将事件侦听器添加到元素:
var closeBtn = $('#iw-close-btn').get();
google.maps.event.addListener(closeBtn, 'click', function() {
console.log('closed');
infowindow.close();
});
但是每当我尝试单击该元素时它都不起作用(日志也没有出现)。
这是我使用 codepen.io 的整个示例代码:
http://codepen.io/dannypranoto/pen/PNdvzb
你能帮我解决一下吗?任何形式的帮助将不胜感激。谢谢!
您说您使用 addDomListener
添加事件侦听器,但您的代码显示使用 addListener
。
您识别关闭按钮的方式不正确。简单看一下 javascript 控制台就可以告诉您这一点。请改用 closeBtn[0]
。
所以完整的代码是:
google.maps.event.addListener(infowindow, 'domready', function() {
var closeBtn = $('#iw-close-btn').get();
google.maps.event.addDomListener(closeBtn[0], 'click', function() {
infowindow.close();
});
});
目前我正在尝试在 Google 地图中实现我自己的自定义信息 Windows。我找到了关于 5 ways to customize Google's InfoWindow 的非常好的教程。从教程中我已经成功创建了自己的自定义信息 Windows,但是我无法在信息 Windows.
中实现自己的关闭按钮根据代码,我创建了自己的关闭按钮,该按钮附加到 InfoWindows' 内容。
<span id="iw-close-btn"><i class="fa fa-lg fa-times white"></i></span>
然后我使用 maps.google.event.addDomListener() 将事件侦听器添加到元素:
var closeBtn = $('#iw-close-btn').get();
google.maps.event.addListener(closeBtn, 'click', function() {
console.log('closed');
infowindow.close();
});
但是每当我尝试单击该元素时它都不起作用(日志也没有出现)。
这是我使用 codepen.io 的整个示例代码: http://codepen.io/dannypranoto/pen/PNdvzb
你能帮我解决一下吗?任何形式的帮助将不胜感激。谢谢!
您说您使用
addDomListener
添加事件侦听器,但您的代码显示使用addListener
。您识别关闭按钮的方式不正确。简单看一下 javascript 控制台就可以告诉您这一点。请改用
closeBtn[0]
。
所以完整的代码是:
google.maps.event.addListener(infowindow, 'domready', function() {
var closeBtn = $('#iw-close-btn').get();
google.maps.event.addDomListener(closeBtn[0], 'click', function() {
infowindow.close();
});
});