简单的javascript settimeout问题

时间:2011-04-22 23:16:56

标签: javascript

<script type="text/javascript">



$(document).ready(function () { initialize(); });

var markerarray = [
['Mount Evans', 39.58108, -105.63535, 4, 'This is Mount Evans.'],
['Badlands National Park', 43.785890, -101.90175, 1, 'This is Badlands National Park']
];


var bounds = new google.maps.LatLngBounds();

function setMarkers(map, markers) {

    for (var i = 0; i < markers.length; i++) {  setTimeout(function() {  

        var markerarray = markers[i];

        var siteLatLng = new google.maps.LatLng(markerarray[1], markerarray[2]);

        var marker = new google.maps.Marker({

            position: siteLatLng,

            map: map,

            animation: google.maps.Animation.DROP,

            title: markerarray[0],

            zIndex: markerarray[3],

            html: markerarray[4]

        }); 


        google.maps.event.addListener(marker, "click", function () {

            $('.info').html(this.html);

        });

        bounds.extend(siteLatLng);

        map.fitBounds(bounds);

    }  , i * 2000); } 

}


    function initialize() {

    var myOptions = {

        disableDefaultUI: true,

        mapTypeId: google.maps.MapTypeId.ROADMAP

    }

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    setMarkers(map, markerarray);

}

当我使用setTimeout(function() {...时,我收到一个javascript错误:“markerarray is undefined”。但是,当我删除超时时,一切都按预期工作。但是我希望每个标记在添加到地图时有延迟。我错过了什么?感谢

2 个答案:

答案 0 :(得分:3)

这需要一些解决,但这是一个非常好的例子,有人可以被抓住。问题在于i而不是markerarray

setTimeout触发(两秒钟后)for循环结束并且i设置为2. markers[i]因此markers[2] },但不存在,因此markerarray(或markerarray2为清晰起见,在我的示例中)设置为undefined

解决方案是在下面的示例中设置另一个变量c。该变量充当您的计数器,因此定义了markerarray2,因为markers[c]已定义。

var markerarray = [
['Mount Evans', 39.58108, -105.63535, 4, 'This is Mount Evans.'],
['Badlands National Park', 43.785890, -101.90175, 1, 'This is Badlands National Park']
];

function setMarkers(markers) {
    var c = 0;
    for (var i = 0; i < markers.length; i++) {  setTimeout(function() {  
            var markerarray2 = markers[c];
            c++;
            alert(markerarray2[0]);
        }, i * 1000);
    } 
}

setMarkers(markerarray);

答案 1 :(得分:0)

我会尝试将MarkerArray定义移到第一行,在任何事情之前