click listeners conflict w/infowindow

我試圖創建一個地圖，允許用戶通過單擊並填充表單（與 seeclickfix.com類似）來報告問題問題。我還沒有建立在php/SQL中，實際上保存了用戶提供的信息。問題：我在我的infowindow的html中有一個按鈕，用於向用戶提供提交信息並關閉窗口。但是，我的新標記事件偵聽器不是僅僅關閉窗口，而是通過infowindow接收點擊，在按鈕後面創建一個不需要的標記。谷歌以某種方式避免了這個問題;在他們的右上角'x'處沒有註冊點擊。我試圖創建一個布爾信號變量（'infopen'）讓我的addMarker函數知道一個infowindow是否打開，但它不是的功能....任何想法爲什麼？click listeners conflict w/infowindow

有關代碼的任何其他建議，將不勝感激！（我的任務是建立一個系統來組織和存儲多個信息窗口/標記...）

<?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>

來源

2012-03-01 Ben H

我做作黑客：添加的setTimeout（）左右infowindow.close（）。有一個理由，下面解釋。

function saveData() { 
    setTimeout(function() { infowindow.close(); }, 100); 
} 

//closes window and clears marker 
function cancel() { 
    setTimeout(function() { infowindow.close(); marker.setMap(null); }, 100); 
}

100 ms似乎是合理的。奇怪的是，在cancel（）中將標記設置爲空映射也必須超時。我不認爲你需要開放信息了。

我從這個代碼示例的想法： http://code.google.com/apis/maps/articles/phpsqlinfo_v3.html

在此示例中，信息窗口只關閉（回調）的數據庫提出要求，並確保反應是良好的售後服務。當然，這需要幾毫秒。因此，在這些假設下，一旦你有你的數據庫部分工作，你可以替換醜陋的setTimeout，一切都應該工作！ :)

來源

2012-03-01 19:27:46

我明白了，聰明。這足夠了。我希望你是正確的，數據庫請求將表現平等。謝謝！ – 2012-03-02 00:23:10

click listeners conflict w/infowindow

回答

相關問題