或者至少，我相信这是一个范围的问题，纠正我，如果我错了。

Or at least I believe it's a scope issue, correct me if I'm wrong.

我有一个for循环，产生在我的地图标记。每一个信息窗口加载不同的内容使用回调到一个AJAX功能。

I have a for loop that generates markers on my map. Each infowindow loads different content using callbacks to an ajax function.

我已经简化此示例勾勒出的问题。

I've simplified this sample to outline the problem.

var xhr = "";
var infowindow = new google.maps.InfoWindow();
var marker, i;
var polylineCoordinates = [new google.maps.LatLng(78.782762, 17.917843),
                           new google.maps.LatLng(-0.829439, -91.112473),
                           new google.maps.LatLng(15.066156, -23.621399),
                          ]


function createHttpRequest() {
    try {   
        xhr = new XMLHttpRequest();
        return xhr;
        }
        catch (e)
        {
            //assume IE6
            try {
            xhr = new activeXBbject("microsoft.XMLHTTP");
            return xhr;
            }
            catch (e)   {
                return alert("Unable to create an XMLHttpRequest object");
            }
        }
}



  function initialize() {

    var mapOptions = {
      center: new google.maps.LatLng(78.782762,17.917843),
      zoom: 10,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
        map = new google.maps.Map(document.getElementById("map_canvas"),
        mapOptions);
  }



//I recreated the polylineCoordinates array (see above)
//to try and replicate and real array in the script

for (i = 0; i < polylineCoordinates.length; i++) {
    marker = new google.maps.Marker({
        position: polylineCoordinates[i],
        map: map
    });

    google.maps.event.addListener(marker, 'click', (function (marker, i) {
        return function () {
            infowindow.setContent("<div id=\"infowindow\">" + getStationInfo(infoWindowDiv) + "</div>");
            infowindow.open(map, marker);

        }
    })(marker, i));

} //End adding markers loop


            function infoWindowDiv(stationInfo) {
                var add = document.createTextNode(stationInfo);
                document.getElementById("infowindow").appendChild(add);
            }


            function getStationInfo(callback) {
                //createHttpRequest() exists globally
                var xhr = createHttpRequest();
                var url = "stations.php" //edited out the original URL
                xhr.onreadystatechange = function () {
                    if (xhr.readyState == 4 && xhr.status == 200) {
                        var stationInfo = "This is a Test";
                        return callback(stationInfo)
                    } //end readyState

                } //end readystatechange
                xhr.open("GET", url, true);
                xhr.send(null);
            } //end getStationInfo

小编辑：在循环移出功能

修改2：是没有错的Ajax调用，该URL被编辑为求样本code。请注意，最后输出显示这是一个测试，其中明确规定，进行了成功的回调信息窗口。此外，公告不存在的responseText或responseXML的。发回的变量被无关的网址

Edit 2: There is nothing wrong with the ajax call, the url was edited for the sake of the sample code. Notice the final output shows "This is a test" in the infowindow which clearly states a successful callback was performed. Moreover, notice there is no responseText or responseXml. The variable being sent back has nothing to do with the url

回调工作正常，但由于某种原因，它淋上在它上面的可怕的未定义。 控制台显示什么。 输出：

The callback works fine but for some reason it's topped with the dreadful 'undefined' on top of it. Console shows nothing. Output:

undefined
This is a test

我是什么做错了吗？又岂是不确定的，如果它的工作原理？

What am I doing wrong? How can it be undefined if it works?

推荐答案

这是怎么回事：

您点击信息窗口 getStationInfo（infoWindowDiv）被调用，打完一个AJAX请求，但没有返回值有用的（不确定，也没有return语句） 的AJAX的功能会遇到一个错误（网址不必要在这一点上不会造成的onreadystatechange功能火）。但是，你告诉我们，是没有问题的。 脚本遇到JavaScript错误未捕获的类型错误：无法调用空法的appendChild，因为与ID信息窗口的股利尚未连接到DOM you click on the infowindow getStationInfo(infoWindowDiv) is called, fires off an AJAX request, but returns nothing useful ("undefined", there is no return statement) The AJAX function will encounter an error (url "Unnecessary at this point" will not cause the onreadystatechange function to fire). But you tell us that isn't a problem. The script encounters the javascript error Uncaught TypeError: Cannot call method 'appendChild' of null because the div with id infowindow hasn't been attached to the DOM.

建议在信息窗口添加事件侦听器不会尝试访问该分区id为信息窗口，直到它被渲染（domready中）。

Suggest adding an event listener on the infowindow to not attempt to access the div with id="infowindow" until it has been rendered (domready).

工作code：

    var xhr = "";
    var infowindow = new google.maps.InfoWindow();
    var map = null;
    var marker, i;
    var polylineCoordinates = [new google.maps.LatLng(78.782762, 17.917843),
                               new google.maps.LatLng(-0.829439, -91.112473),
                               new google.maps.LatLng(15.066156, -23.621399)
                              ]


      function initialize() {
        var mapOptions = {
          center: new google.maps.LatLng(78.782762,17.917843),
          zoom: 10,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
            map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);

    for (i = 0; i < polylineCoordinates.length; i++) {
        marker = new google.maps.Marker({
            position: polylineCoordinates[i],
            map: map
        });

        google.maps.event.addListener(marker, 'click', (function (marker, i) {
            return function () {
                infowindow.setContent("<div id=\"infowindow\" style=\"height:50px;width:200px;\"></div>");
                infowindow.open(map, marker);
            google.maps.event.addListenerOnce(infowindow,"domready", function(){
                  getStationInfo(infoWindowDiv);
                });
        })(marker, i));

    } //End adding markers loop

    }
            function infoWindowDiv(stationInfo) {
                var add = document.createTextNode(stationInfo);
                document.getElementById("infowindow").appendChild(add);
            }


            function getStationInfo(callback) {
                var stationInfo = "This is a Test";
                callback(stationInfo)
            } //end getStationInfo

    google.maps.event.addDomListener(window, 'load', initialize);