单击listeners conflict w/ infowindow
我正在尝试创建一个地图，允许用户通过单击并在信息窗口中填写表单(类似于seeclickfix.com)来报告跟踪问题。我还没有内置实际保存用户提供的信息的php/SQL。问题:我在我的infowindow的html中有一个按钮，用户可以用它来提交信息和关闭窗口。我的新标记的事件侦听器通过infowindow接收点击，而不是仅仅关闭窗口，在按钮后面创建一个不需要的标记。谷歌以某种方式避免了这个问题；在他们的右上角没有注册点击-退出'x‘。我尝试创建一个布尔信号变量('infopen')来让我的addMarker函数知道是否有一个信息窗口是打开的，但它不起作用……你知道为什么吗？
任何关于代码的其他建议都将不胜感激！(我的任务是创建一个系统来组织和存储多个信息窗口/标记...)
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test Reporter </title>
<script type="text/javascript" src="http://maps.google.com/maps/
api/js?sensor=false"></script>
<script type="text/javascript">
var map;
var marker;
var markers = [];
var infowindow;
var infopen = false;
var edit = true;
var pos = new google.maps.LatLng(44.021, -71.831102);
function initialize() {
var mapOptions = {
zoom: 14,
center: pos,
mapTypeControl: true,
panControl: false,
zoomControl: true,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
var table = "<table>" +
"<tr><td>Problem:</td> <td><input type='text'
id='prob'/> </td> </tr>" +
"<tr><td>Description:</td> <td><input type='text'
size='30' id='desc'/></td> </tr>" +
"<tr><td align=right ><input type='button'
value='Save & Close' onclick='saveData()' /></td>" +
"<td><input type='button' value='Cancel & Delete'
onclick='cancel()' /></td></tr>";
infowindow = new google.maps.InfoWindow({
content: table
});
google.maps.event.addListener(map, "click", function(event) {
addMarker(event.latLng);
});
} //end initialize
// Add a marker to the map and push to the array, open an infowindow listener.
function addMarker(location) {
if (editon.editT[0].checked) edit = true; //check 'edit' radio buttons
if (editon.editT[1].checked) edit = false;
alert('infopen is ' + infopen);
if (edit== true && infopen== false) {
//if edit toggle is selected and infowindow not open
marker = new google.maps.Marker({
position: location, //from event.latLng
map: map,
draggable: true,
});
markers.push(marker); //add to markers array
google.maps.event.addListener(marker, "click", function() {
//listener for infowindow
infowindow.open(map, marker);
infopen = true; // stop the creation of new markers *in theory...
//alert('infopen is ' + infopen);
});
}// end if
} //end addMarker()
// Sets the map on all markers in the array. (only used when clearing)
function setAllMap(map) {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(map);
}
}
// Deletes all markers in the array by removing references to
them.
function deleteOverlays() {
setAllMap(null);
markers = [];
}
//would passes along info to php... not yet
function saveData() {
infowindow.close();
infopen = false; //reallow marker creation from click
}
//closes window and clears marker
function cancel() {
infowindow.close();
infopen = false; // reallow marker creation ***click still
heard by event listener***
marker.setMap(null); //just clears from map
}
</script>
</head>
<body onload="initialize()">
<br> </br>
<form name="editon"> Turn on editing:
<input type="radio" name="editT" value='true' checked/>Yes
<input type="radio" name="editT" value='false' />No
</form>
<div id="map_canvas" style="width:100%; height:70%"></div>
<p>If too cluttered:
<input onclick="deleteOverlays();" type=button value="Clear Map"/>
</body>
</html>回答 1
Stack Overflow用户
发布于 2012-03-02 03:27:47
我的人工技巧:在infowindow.close()周围添加一个setTimeout()。这是有道理的，如下所述。
function saveData() {
setTimeout(function() { infowindow.close(); }, 100);
}
//closes window and clears marker
function cancel() {
setTimeout(function() { infowindow.close(); marker.setMap(null); }, 100);
}100ms似乎是合理的。奇怪的是，在cancel()中将标记设置为null map也必须超时。我认为你不再需要infopen了。
我是从这个代码示例中得到这个想法的：http://code.google.com/apis/maps/articles/phpsqlinfo_v3.html
在此示例中，只有在发出数据库请求并确保响应良好之后，infoWindow才会关闭(在回调中)。当然，这肯定需要几毫秒的时间。因此，在这些假设下，一旦您的DB部件正常工作，您就可以替换丑陋的setTimeout，一切都应该正常工作！:)
https://stackoverflow.com/questions/9511046
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号