javascript for循环直到循环结束才执行函数，然后迭代函数n次

我试图从一个循环中加载一些带有google地图图像的div，该循环将一个图像添加到document.get的值中。问题是getLocation（）调用在循环的最后一次迭代时出现，但随后循环n次

for(var i = 1; i < length; i++){
var longitude = 1.8612393999999999;
var latitude = 50.7263312;
document.getElementById("longInput").value = longitude;
document.getElementById("latInput").value = latitude;

var mapholder = "mapholderM"+i;
document.getElementById("mapholderValue").value = mapholder;
theMapholder=document.getElementById(mapholder);

getLocation();
}

从我的循环调用此方法：

for(var i = 1; i < length; i++) {        
    var longitude = 1.8612393999999999;
    var latitude = 50.7263312;

    alert("end of loop");        
    pulse();
}

for（var i=1；i

导致n次警报，然后执行脉冲？抱歉搞混了

院长

更新： 谷歌地图脚本：

function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(showPosition,showError);
    }
  else{x.innerHTML="Geolocation is not supported by this browser.";}
  }

function showPosition(position)
  {
  alert($("#longInput").val()); */
  lat= $("#latInput").val();
  lon= $("#longInput").val();
  latlon=new google.maps.LatLng(lat, lon);
  mapholder=theMapholder;

  alert("getLocation " + theMapholder);

  var myOptions={
  center:latlon,zoom:14,
  mapTypeId:google.maps.MapTypeId.ROADMAP,
  mapTypeControl:false,
  navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
  };
  var map=new google.maps.Map(theMapholder,myOptions);
  var marker=new google.maps.Marker({position:latlon,map:map,title:"You are here!"});
  }

  function showError(error)
  {
  switch(error.code) 
    {
    case error.PERMISSION_DENIED:
      x.innerHTML="User denied the request for Geolocation."
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML="Location information is unavailable."
      break;
    case error.TIMEOUT:
      x.innerHTML="The request to get user location timed out."
      break;
    case error.UNKNOWN_ERROR:
      x.innerHTML="An unknown error occurred."
      break;
    }
  }
</script>

函数getLocation（） { if（导航器.地理位置） { navigator.geolocation.getCurrentPosition（showPosition，showError）； } else{x.innerHTML=“此浏览器不支持地理位置。”；} } 功能显示位置（位置） { 警报（$（“#longInput”）.val（））*/ 拉丁语=$（“#拉丁语输入”）.val（）； lon=$（“#longInput”）.val（）； latlon=新的google.maps.LatLng（lat，lon）； 地图持有人=地图持有人； 警报（“getLocation”+theMapholder）； 变异性肌肽={ 中心：拉特隆，缩放：14， mapTypeId:google.maps.mapTypeId.ROADMAP， mapTypeControl:false， navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL} }; var map=new google.maps.map（theMapholder，myOptions）； var marker=new google.maps.marker（{position:latlon，map:map，title:“You here！”}）； } 功能错误（错误） { 开关（错误代码） { 案例错误。权限被拒绝： x、 innerHTML=“用户拒绝了地理位置请求。” 打破 案例错误。位置不可用： x、 innerHTML=“位置信息不可用。” 打破 大小写错误。超时： x、 innerHTML=“获取用户位置的请求超时。” 打破 案例错误。未知错误： x、 innerHTML=“发生未知错误。” 打破 } } 使用showPosition中的警报，我可以看到只有在循环更新元素后才会调用它

---

为什么a函数的行为会像这样，并且只有在循环执行完所有其他操作后才被调用？

正如任何人都知道的那样，读到这篇文章时有点困惑，可能是因为需要了解更多信息和javascript，尽管您将在评论中看到，我有一些好的建议可以学习。任何关于我的问题解决方案：

在循环完成对所有其他代码的迭代后，getLocation（）被初始化。因此，作为一个黑客，当迭代getLocation（）方法时，就是进行函数可以使用的元素值更改的时候：

  var y=1;
  var x=document.getElementById("demo");

  function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(showPosition,showError);
    }
  else{x.innerHTML="Geolocation is not supported by this browser.";}
  }

  function showPosition(position)
  {
    var longitude = -1.8612393999999999;
    var latitude = 50.7263312;

    document.getElementById("longInput").value = longitude;
    document.getElementById("latInput").value = latitude;

    var mapholder = "mapholderM"+y;
    document.getElementById("mapholderValue").value = mapholder;
    theMapholder=document.getElementById(mapholder);

    lat= $("#latInput").val();   
    lon= $("#longInput").val();
    latlon=new google.maps.LatLng(lat, lon);
    mapholder=theMapholder; 
    alert("getLocation " + theMapholder+y);
    y++;

    var myOptions={
      center:latlon,zoom:14,
      mapTypeId:google.maps.MapTypeId.ROADMAP,
      mapTypeControl:false,
      navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
    };

  var map=new google.maps.Map(theMapholder,myOptions);
  var marker=new google.maps.Marker({position:latlon,map:map,title:"You are here!"});
}

---

请注意，引入了变量y，每次调用该方法以在get元素id中使用时，该变量的值都会递增。

请缩进代码。它很难阅读。查看“getLocation（）”函数会非常有帮助。像“delay”、“fadeOut”等效果都是异步的。“脉冲”功能将立即返回，但效果将随着时间的推移而继续。您不能以这种方式进行逐渐的更改（如“fadeIn”）。您可以将回调函数传递给这些动画，并从回调中启动后续动画。在for循环中，用户界面在每次迭代for循环后都会更新，因此无法在for循环中进行多个可视更改。您必须使用异步回调来实现它，比如使用setTimeout

  var y=1;
  var x=document.getElementById("demo");

  function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(showPosition,showError);
    }
  else{x.innerHTML="Geolocation is not supported by this browser.";}
  }

  function showPosition(position)
  {
    var longitude = -1.8612393999999999;
    var latitude = 50.7263312;

    document.getElementById("longInput").value = longitude;
    document.getElementById("latInput").value = latitude;

    var mapholder = "mapholderM"+y;
    document.getElementById("mapholderValue").value = mapholder;
    theMapholder=document.getElementById(mapholder);

    lat= $("#latInput").val();   
    lon= $("#longInput").val();
    latlon=new google.maps.LatLng(lat, lon);
    mapholder=theMapholder; 
    alert("getLocation " + theMapholder+y);
    y++;

    var myOptions={
      center:latlon,zoom:14,
      mapTypeId:google.maps.MapTypeId.ROADMAP,
      mapTypeControl:false,
      navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
    };

  var map=new google.maps.Map(theMapholder,myOptions);
  var marker=new google.maps.Marker({position:latlon,map:map,title:"You are here!"});
}