JavaScript变量作用域问题：Google Maps API中Counter始终为0

安全阿岳

2026-7-15

问题分析与解决

问题根源

你遇到的问题不是作用域或变量提升，而是异步操作的执行顺序。downloadUrl是异步发起HTTP请求的函数，它的回调函数会在请求完成后才执行，但你在回调函数外部就去判断counter的值——这时候请求还没返回，counter依然是初始的0，所以无论实际有多少标记，判断逻辑都只会进入else分支。

修复方案

把判断counter和更新按钮的逻辑移到downloadUrl的回调函数内部，确保只有在标记数据加载完成、counter被正确更新后，才执行状态判断：

google.maps.event.addListener(map, 'bounds_changed', function() {
    bounds = map.getBounds();
    var ne = bounds.getNorthEast();
    var sw = bounds.getSouthWest();
    n = ne.lat();
    e = ne.lng();
    s = sw.lat();
    w = sw.lng();
    var counter = 0;
    var xmlfile = 'php-to-xml-dev.php?n=' + n + "&e=" + e + "&s=" + s + "&w=" + w;
    
    downloadUrl(xmlfile, function(doc) {
        var xmlDoc = xmlParse(doc);
        var markers = xmlDoc.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
            var lat = parseFloat(markers[i].getAttribute("lat"));
            var lng = parseFloat(markers[i].getAttribute("lng"));
            var point = new google.maps.LatLng(lat,lng);
            var content=markers[i].getAttribute("content");
            var icn=markers[i].getAttribute("icon");
            createMarker(point, content, icn);
            counter++;
        }
        
        // 把判断逻辑移到回调内部
        if (counter > 0) {
            locationButton.classList.add("custom-map-control-hidden");
        } else {
            locationButton.textContent = 'No defibs visible. Try zooming out.';
            // 调试用代码可删除：locationButton.textContent = counter;
        }
    });
});