JavaScript变数setTimeout函数内未定义

Question

我有以下代码：

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

     var lat = markers[i][0]; 
     var lng = markers[i][1]; 
     var img = markers[i][2]; 
     var info = markers[i][3]; 

     setTimeout(function(lat, lng, img, info) { 
      console.log(lat + ', ' + lng); 
      $('#map').gmap3({ 
       action: 'addMarker', 
       latLng:[lat, lng], 
       options:{ 
        animation: google.maps.Animation.DROP, 
        icon: img 
       }, 
       events:{ 
        click: function(marker, event, data){ 
         $(this).gmap3({action:'addinfowindow', anchor:marker, options:{content: '<div id="content" style="width:300px;height:250px;"><img src="' + info + '"></img></div>'}}); 
         /*var infowindow = $(this).gmap3({action:'get', name:'infowindow'}); 
         infowindow.close();*/ 
        }, 
       } 
      }); 
     }, i* 100); 
    } 

的的console.log是表示未定义lat和LNG。为什么是这样？

以前我没有在超时时间内将任何变量传递给函数，并且它们在WERE中定义，但它对for循环中的每个标记都使用了相同的标记，这显然是错误的！

任何想法？

Answer 1

lat和lng被命名为您的超时函数的参数，但setTimeout不会将任何参数传递给该函数，因此它们保持未定义状态。

你应该将超时设置成一个单独的功能，以建立您的变量封闭：

function configureTimeout(i, lat, lng, img, info) { 
    setTimeout(function() { 
     console.log(lat + ', ' + lng); 
     $('#map').gmap3({ 
      action: 'addMarker', 
      latLng:[lat, lng], 
      options:{ 
       animation: google.maps.Animation.DROP, 
       icon: img 
      }, 
      events:{ 
       click: function(marker, event, data){ 
        $(this).gmap3({action:'addinfowindow', anchor:marker, options:{content: '<div id="content" style="width:300px;height:250px;"><img src="' + info + '"></img></div>'}}); 
        /*var infowindow = $(this).gmap3({action:'get', name:'infowindow'}); 
        infowindow.close();*/ 
       }, 
      } 
     }); 
    }, i* 100); 
} 

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

    var lat = markers[i][0]; 
    var lng = markers[i][1]; 
    var img = markers[i][2]; 
    var info = markers[i][3]; 

    configureTimeout(i, lat, lng, img, info); 

} 

Answer 2

试试这个：

setTimeout(function(){myFunc(lat, lng, img, info);},i*100) 

function myFunc(lat, lng, img, info) { .... } 

Answer 3

setTimeout(function(lat, lng, img, info) {

应该

setTimeout(function() {

Answer 4

您需要将这些参数传递给匿名函数，setTimeout不会为你做：

setTimeout(function() { 
    (function(lat, lng, img, info) { 
     console.log(lat + ', ' + lng); 
     // ... snip ... 
    })(lat, lng, img, info); 
}, i* 100); 

Answer 5

您需要附上您的setTimeout在一个封闭，与当前PARAMS值自动执行：

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

    var lat = markers[i][0]; 
    var lng = markers[i][1]; 
    var img = markers[i][2]; 
    var info = markers[i][3]; 
    (function(latitude, longitude, image, infos) { // Attention these must be named differently! 
     setTimeout(function() { 
      console.log(latitutde + ', ' + longitude); // use the inner param names here and after! 
      $('#map').gmap3({ ...omitted... }}); 
     }, i* 100); 
    })(lat, lng, img, info) 
} 

顺便说一下，与上面的@lanzz解决方案没有太大的区别，我认为它更好，因为它重构了实际的功能，这是更清洁！ :)