javascript 为 google.maps.InfoWindow 类监听 domready 事件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5416160/
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
Listening for the domready event for google.maps.InfoWindow class
提问by jamesatha
So, I am trying to make add a google map to my webpage. I want to add a form into the pop-up bubble when you click on a marker on the map.
所以，我想在我的网页上添加一个谷歌地图。当您单击地图上的标记时，我想在弹出的气泡中添加一个表单。
The API documentation says that the domready
API 文档说 domready
"event is fired when the containing the InfoWindow's content is attached to the DOM. You may wish to monitor this event if you are building out your info window content dynamically."
“当包含 InfoWindow 的内容附加到 DOM 时会触发事件。如果您正在动态构建您的信息窗口内容，您可能希望监视此事件。”
How do I listen to this event?
我如何收听此事件？
This is the documentation.
这是文档。
回答by Chris4d
I just solved a similar problem myself. To listen for the domready event, use the following syntax:
我自己刚刚解决了一个类似的问题。要侦听 domready 事件，请使用以下语法：
infoWindow = new google.maps.InfoWindow();
google.maps.event.addListener(infoWindow, 'domready', function() {
// whatever you want to do once the DOM is ready
});
回答by wilfredonoyola
The google.maps.event.addListener() event waits for the creation of the infowindow HTML structure 'domready' and before the opening of the infowindow defined styles are applied.
google.maps.event.addListener() 事件等待信息窗口 HTML 结构“domready”的创建，并在应用信息窗口定义的样式打开之前。
I have worked with this example :
我已经使用过这个例子：
google.maps.event.addListener(infowindow, 'domready', function() {
// Reference to the DIV which receives the contents of the infowindow using jQuery
var iwOuter = $('.gm-style-iw');
var iwBackground = iwOuter.prev();
// Remove the background shadow DIV
iwBackground.children(':nth-child(2)').css({'display' : 'none'});
// Remove the white background DIV
iwBackground.children(':nth-child(4)').css({'display' : 'none'});
});
Then
然后
.gm-style-iw {
width: 350px !important;
top: 0 !important;
left: 0 !important;
background-color: #fff;
box-shadow: 0 1px 6px rgba(178, 178, 178, 0.6);
border: 1px solid rgba(72, 181, 233, 0.6);
border-radius: 2px 2px 0 0;
}
Result :
结果 ：
Reference : http://en.marnoto.com/2014/09/5-formas-de-personalizar-infowindow.html
参考：http: //en.marnoto.com/2014/09/5-formas-de-personalizar-infowindow.html
Thanks
谢谢
回答by nrii
var contentString = 'your form here';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title:"My Form"
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
