javascript 如何为 Google 地图的 addDOMListener 添加操作？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11405795/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add a action for addDOMListener of Google Maps?
提问by Sadesh Kumar N
I just want to load the Google Maps based on the Mouseover event of different div element. For doing this I just used the following simple code. This code itself not working, can someone tell me what mistake I have made?
我只想根据不同 div 元素的鼠标悬停事件加载谷歌地图。为此，我只使用了以下简单代码。这段代码本身不起作用，有人能告诉我我犯了什么错误吗？
<script type="text/javascript">
function initialize() {
var mapDiv = document.getElementById('map-canvas');
var map = new google.maps.Map(mapDiv, {
center: new google.maps.LatLng(40.740, -74.18),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var content = '<strong>A info window!</strong><br/>That is bound to a marker';
var infowindow = new google.maps.InfoWindow({
content: content
});
var marker = new google.maps.Marker({
map: map,
position: map.getCenter(),
draggable: true
});
infowindow.open(map, marker);
}
google.maps.event.addDomListener($("#showmap"), 'mouseover', function(){ alert("Hi");});
</script>
<div id='showmap'>
Show Map
</div>
<div id="map-canvas" style="width: 500px; height: 400px"></div>
Above simple alert function itself not called for this simple code.
上面简单的alert函数本身没有调用这个简单的代码。
回答by Tina CG Hoehr
The selector returns the jQuery object and the needed element can be accessed directly from the element array with a [0]. Also, make it "addDomListenerOnce", only need to initialize once.
选择器返回 jQuery 对象，需要的元素可以直接从元素数组中访问[0]。另外，让它成为“addDomListenerOnce”，只需要初始化一次。
$("#showmap")[0]
google.maps.event.addDomListenerOnce($("#showmap")[0], 'mouseover',
function(){ initialize(); });
回答by Sadesh Kumar N
I just tried using this and this also worked.
我只是尝试使用它，这也有效。
Java Script Code:
Java脚本代码：
function initialize(lat,longit,content) {
var mapDiv = document.getElementById('map-canvas');
var map = new google.maps.Map(mapDiv, {
center: new google.maps.LatLng(lat, longit),
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow({
content: content
});
var marker = new google.maps.Marker({
map: map,
position: map.getCenter(),
draggable: false
});
infowindow.open(map, marker);
}
Html Code:
html代码：
<div id='showmap' onclick="initialize(1.37422,103.945,'<h2>Tampines</h2>')">
Show Map
</div>
I just tried using an idea from java, can we try a method call from the onclick and check whether it is working and to my surprise it worked.
我刚刚尝试使用 java 中的一个想法，我们可以尝试从 onclick 调用方法并检查它是否有效，令我惊讶的是它有效。
