Google地图infowindow无法在标记点击上工作 [英] Google Maps infowindow don't work on marker click

问题描述

我正在使用Google Maps API v3地理编码服务。地理编码部分正常工作。我在文本框中输入一个邮政编码，然后点击提交按钮。然后在我输入文本框的地方显示一个蓝色标记。然后它会加载20公里范围内的地点，并用红色标记显示这些地点。这一切都很好。但后来我在infowindow中遇到了一些问题。

如果我点击一个标记（红色或蓝色），它什么都不会发生。我无法弄清楚。我使用这个代码infowindow：

  $。ajax（{
 url：'data.php'，
 type：'POST'，
 data：{xmldata：jqXHR.responseText}，
 success：function（locations，textStatus，jqXHR）{
 
 var split = locations。 split（，）; 
 
 var checkForDouble = split.filter（function（elem，pos）{
 return split.indexOf（elem）== pos; 
}） ; 
 
 for（var i = 0; i< split.length; i ++）{
 geocoder.geocode（
 {'address'：checkForDouble [i]}，
 function（results，status）{
 if（results！= null）{
 marker = new google.maps.Marker（{
 map：map，
 position： results [0] .geometry.location 
}）; 
} 
} 
）; 
 
 var infocontent = checkForDouble [i]; 
 var infowindow = new google.maps.InfoWindow（）; 
 
 google.maps.event.addListener（marker，'click'，（function（marker，infocontent）{
 return function（）{
 infowindow.setContent（infocontent）; 
 infowindow.open（map，marker）; 
} 
}）（marker，infocontent））; 
 
 
 $ / code $ / pre 
 
 
有人可以给我一个提示， ？
解决方案
您还需要在geocoder调用上关闭函数。
  var infowindow = new google.maps.InfoWindow（）; 
 
函数createMarker（地址）
 var marker = new google.maps.Marker（{
 map：map，
 position：results [0] .geometry.location 
}）; 
 var infocontent = address; 
 
 google.maps.event.addListener（marker，'click'，function（）{
 infowindow.setContent（infocontent）; 
 infowindow.open（map，marker）; 
}）; 
返回标记; 
} 
函数geocodeAddress（地址）{
 geocoder.geocode（
 {'地址'：地址，
函数（结果，状态）{
 if （（results！= null）&&（status == google.maps.GeocoderStatus.OK））{
 var marker = createMarker（address）; 
} else alert（geocode failed on + address +，status =+ status）; 
} 
）; 
 
 
 $ .ajax（{
 url：'data.php'，
 type：'POST'，
 data：{xmldata：jqXHR .responseText}，
 success：function（locations，textStatus，jqXHR）{
 
 var split = locations.split（，）; 
 
 var checkForDouble = split.filter（function（elem，pos）{
 return split.indexOf（elem）== pos; 
}）; 
 
 for（var i = 0; i< ; split.length; i ++）{
 geocodeAddress（checkForDouble [i]）; 
} 
} 
  
 
I'm using Google Maps API v3 geocoding service. The geocoding part works fine. I type a zip code in a textbox and then hit the submit button. Then it shows a blue marker at the place which I typed in the textbox. And then it loads places in a radius of 20km and display these with a red marker. That all works fine. But then I got some problems with the infowindow.

If I click on a marker (red or blue) it happens nothing. And I just can't figure it out. I use this code for infowindow:
$.ajax({
    url: 'data.php',
    type: 'POST',
    data: {xmldata: jqXHR.responseText},
    success: function(locations, textStatus, jqXHR){

        var split = locations.split(",");

        var checkForDouble = split.filter(function(elem, pos) {
            return split.indexOf(elem) == pos;
        });

    for(var i = 0; i < split.length; i++){
        geocoder.geocode(
            {'address': checkForDouble[i]},
            function(results, status){
                if(results != null){
                    marker = new google.maps.Marker({
                        map: map,
                        position: results[0].geometry.location
                    });
                }
            }
        );

        var infocontent = checkForDouble[i];                                        
        var infowindow = new google.maps.InfoWindow();

        google.maps.event.addListener(marker, 'click', (function(marker, infocontent) {
            return function(){
                infowindow.setContent(infocontent);
                infowindow.open(map, marker);
            }
        })(marker, infocontent));
    }                                   
}
Can someone give me a hint where I made the error?
解决方案
You need function closure on your geocoder call also.
var infowindow = new google.maps.InfoWindow();

function createMarker(address)
    var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
    var infocontent = address;                                        

    google.maps.event.addListener(marker, 'click', function() {
            infowindow.setContent(infocontent);
            infowindow.open(map, marker);
    });
    return marker;
}
function geocodeAddress(address) {
    geocoder.geocode(
        {'address': address,
        function(results, status){
            if((results != null) && (status == google.maps.GeocoderStatus.OK)) {
               var marker = createMarker(address);
            } else alert("geocode failed on "+address+", status="+status);
        }
    );
}

$.ajax({
    url: 'data.php',
    type: 'POST',
    data: {xmldata: jqXHR.responseText},
    success: function(locations, textStatus, jqXHR){

        var split = locations.split(",");

        var checkForDouble = split.filter(function(elem, pos) {
            return split.indexOf(elem) == pos;
        });

    for(var i = 0; i < split.length; i++){
       geocodeAddress(checkForDouble[i]);
    }                              
 }


                        
这篇关于Google地图infowindow无法在标记点击上工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！