最初に地図をクリックすると、マーカーが表示されます。次に、マーカーをクリックすると、最初にアラートが表示されます。次に、地図上の任意の場所をクリックしてから、マーカーをクリックします。次に、3 回目に地図をクリックすると、アラートが 2 回表示されます。マーカーのクリックでアラートが 3 回表示されるなど、マーカーのクリックでアラートが複数回発生するのはなぜですか? クリックイベントが複数回発生するのはなぜですか? 私を助けてください？
<!DOCTYPE html>
<html>
<head>
<title>Accessing arguments in UI events</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<link href="http://code.google.com//apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
var infowindow;
function initialize() {
infowindow = new google.maps.InfoWindow();
var mapOptions = {
zoom: 2 ,
center: new google.maps.LatLng(-25.363882,131.044922),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
markerForWhatsHere = new google.maps.Marker({
// position: position,
map: map
});
google.maps.event.addListener(map, 'click', function(e) {
// placeMarker(e.latLng, map);
whatsHereEventLatLng=e.latLng;
whatsHere();
});
}
var markerForWhatsHere;
var map ;
function whatsHere(){
//alert("whats here latlng is "+ whatsHereEventLatLng);
if (markerForWhatsHere != undefined)
{
var addressForWhatsHere;
var tmpName;
markerForWhatsHere.setMap(null);
// google.maps.event.clearListeners(map, 'click');
markerForWhatsHere.setPosition(null);
markerForWhatsHere.setMap(map);
markerForWhatsHere.setPosition(whatsHereEventLatLng);// updating marker positin for whats here
var image = "http://www.google.com/intl/en_ALL/mapfiles/marker_greenA.png";
var geocoder = new google.maps.Geocoder();
geocoder.geocode({
latLng:whatsHereEventLatLng
}, function(responses,status)
{
if (responses && responses.length > 0)
{
addressForWhatsHere=responses[0].formatted_address; //for address
// alert("address is "+address);
for (i = 0; i < responses[0].address_components.length; ++i)//gettin city name where right click happen
{
for (j = 0; j < responses[0].address_components[i].types.length; ++j)
{
if (responses[0].address_components[i].types[j] == "locality") //for city
{
city = responses[0].address_components[i].long_name;
}
}
} //end code for getting city
}
if(typeof(city)=='undefined')
city='Unknown';
if(typeof(address)=='undefined')
address='Unknown';
infowindow.setContent("<b>Address : </b>"+addressForWhatsHere+" <br><b>City : </b>"+city+"<br><b> Lat.-lng. : </b>"+whatsHereEventLatLng);
infowindow.open(map, markerForWhatsHere);
markerForWhatsHere.setIcon(image);
var splitAddress=[];
splitAddress=address.split(",");
tmpName=splitAddress[0];
var markerTitle=image;
});//end of geocoder
google.maps.event.addListener(markerForWhatsHere, 'click', function (event)
{
alert("addressForWhatsHere "+addressForWhatsHere);
if (event.alreadyCalled_) {
// alert('circle clicked again');
}
else {
var markerTitle=markerForWhatsHere.getIcon();
// alert("marker title is "+markerTitle);
if(markerTitle.indexOf("green")!=-1)
{ //for marker selection
setMarkerTitle=markerTitle.replace("green","yellow");//changing color of marker
markerForWhatsHere.setIcon(setMarkerTitle);
}//end if marker is green //end of marker selection
if(markerTitle.indexOf("yellow")!=-1)
{//for marker unselection
setMarkerTitle=markerTitle.replace("yellow","green"); //changing color of marker
markerForWhatsHere.setIcon(setMarkerTitle);
}//end if marker is yellow
event.alreadyCalled_ = true; }
});//end of marker click
}
infowindow.close();
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>