1

我目前正在从事 Google Maps 项目并正在实施搜索功能。在我的搜索功能中，我试图在侧面列出刚刚添加到地图中的搜索器对应于每个大厅的内容。然而，在组装这个字符串时，我遇到了一个问题，side_bar_html如果我不先警告数据，我的变量将不会输出。

这是我的 searchMap 函数。变量声明如下：var side_bar_html = "";

function searchMap(term, map) {

closeSearch();  

searchCount = 0;
searchMarkers = [];

var request = GXmlHttp.create();

    request.open("GET", "admin/search.php?s=" + term, true);

    request.onreadystatechange = function() {

    if (request.readyState == 4) {

        var xmlDoc = GXml.parse(request.responseText);
        var points = xmlDoc.documentElement.getElementsByTagName("point");

        var polygonsToShow = [];
        for (var i = 0; i < points.length; i++) {                                   
            var lat = parseFloat(points[i].getAttribute("lat"));
            var lng = parseFloat(points[i].getAttribute("lng"));
            var pid = points[i].getAttribute("id");
            for(var j = 0; j < polygons.length; j++) {
                if(polygons[j].vt_bid == pid) {
                    polygonsToShow.push(j);
                }
            }
            var point = new GLatLng(lat,lng);           
            var pname = points[i].getAttribute("name");
            var curMarker = createSearchMarker(point, pid, pname,getLetter(i));                 
            map.addOverlay(curMarker);
        }
        //olays.buildings.checked = false; : Figure out some way to uncheck the buildings overlay checkbox?
        for(var k = 0; k < polygons.length; k++) {
            polygons[k].hide();
        }

        for(var l = 0; l < polygonsToShow.length; l++){ 
            polygons[polygonsToShow[l]].show();
        }
    }
}

request.send(null);
alert(side_bar_html); //side_bar_html will be empty unless I alert the variable


searchResults = new HtmlControl('<div style="background-color:white; border:solid 1px grey; padding:2ex; overflow:auto; width:125px; margin:1px;  font-size:14px;"><img align="right" style="cursor: pointer;" src="http://www.thebort.com/maps/images/close.gif" onclick="closeSearch()"><strong>Search</strong><br/>' + side_bar_html + '</div>', {selectable:true});
map.addControl(searchResults, new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(20, 70)));

}

以及创建搜索标记的功能：

function createSearchMarker(point, id, pname, letIcon) {
    var marker = new GMarker(point,letIcon);
    GEvent.addListener(marker, "click", function() {         
        marker.openInfoWindowHtml('<a href="#" onclick=\'tb_show("' + pname + '","admin/get_info.php?b=' + id + '&KeepThis=true&TB_iframe=true&height=400&width=600",false); return false;\'>' + pname + '</a>');

     });

side_bar_html = side_bar_html + '<a href="javascript:clickSearch(' + searchCount + ')">' + String.fromCharCode("A".charCodeAt(0) + searchCount) + ': ' + pname + '</a><br>';
marker.vt_id = id;
    searchMarkers.push(marker);
searchCount++;

    return marker;
 }

我现在想将这个项目的代码暴露在最低限度，所以如果有什么需要解释的，请告诉我。谢谢！

4

2 回答 2

4

所以我对你的问题的理解side_bar_html是在onreadystatechange函数调用期间设置的，但是除非你提醒它，否则你看不到它被设置。

以下是可能发生的情况：Ajax 请求需要一些时间才能发生。当您调用req.send(null)then 时，会启动请求，但您的onreadystatechange函数要等到稍后的某个时间，在您的 Web 浏览器发出请求并得到响应之后才会被调用。

因此，当您立即尝试使用该side_bar_html值时，它不起作用，因为响应尚未返回。但是，当您提醒该值时，执行提醒所花费的时间使浏览器有时间获得响应并side_bar_html适当地设置该值。

您的根本问题是 Ajax 是异步的（A 来自那里）并且您尝试同步使用它（这意味着您假设事情总是以特定的顺序发生）。最好的办法是把使用的代码side_bar_html放在你的onreadystatechange函数中，这样它在设置之前就不会被使用。

于 2008-11-12T15:19:27.337 回答
0

将下面的代码添加到 onreadystatechange 函数的末尾（在 if 语句中检查值 4）。例如：

request.onreadystatechange = function() {

if (request.readyState == 4) {

    var xmlDoc = GXml.parse(request.responseText);
            var points = xmlDoc.documentElement.getElementsByTagName("point");

            var polygonsToShow = [];
            for (var i = 0; i < points.length; i++) {                                                       
                    var lat = parseFloat(points[i].getAttribute("lat"));
                    var lng = parseFloat(points[i].getAttribute("lng"));
                    var pid = points[i].getAttribute("id");
                    for(var j = 0; j < polygons.length; j++) {
                            if(polygons[j].vt_bid == pid) {
                                    polygonsToShow.push(j);
                            }
                    }
                    var point = new GLatLng(lat,lng);                       
                    var pname = points[i].getAttribute("name");
                    var curMarker = createSearchMarker(point, pid, pname,getLetter(i));                             
                    map.addOverlay(curMarker);
            }
            //olays.buildings.checked = false; : Figure out some way to uncheck the buildings overlay checkbox?
            for(var k = 0; k < polygons.length; k++) {
                    polygons[k].hide();
            }

            for(var l = 0; l < polygonsToShow.length; l++){ 
                    polygons[polygonsToShow[l]].show();
            }

            searchResults = new HtmlControl('<div style="background-color:white; border:solid 1px grey; padding:2ex; overflow:auto; width:125px; margin:1px;  font-size:14px;"><img align="right" style="cursor: pointer;" src="http://www.thebort.com/maps/images/close.gif" onclick="closeSearch()"><strong>Search</strong><br/>' + side_bar_html + '</div>', {selectable:true});
            map.addControl(searchResults, new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(20, 70)));
}
于 2008-11-12T15:26:00.197 回答