Question

我正在尝试使用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();
}

getLocation（）对lat和lon变量使用longInput和latInput值，并使用Mapholder作为放置目标div图像的位置。地图能够获得坐标，并在循环的最后或结尾处解释theMapholder值。

我认为这不是getLocation（）的问题，而是我尝试使用它的更多方法。通过在getLocation（）调用中添加警报并查看屏幕上的元素，我知道这一点通过循环和更改填充元素，然后在发生这种情况后调用位置n次。然后getLocation（）仅获取在给定元素值的迭代完成时设置的值。

在循环开始时添加一个警告会使循环循环n次，然后只执行一次getLocation（）。

总结一下：循环并逐个更改元素值。一旦完成，就会调用getLocation（），迭代次数相同。 getLocation（）现在只能访问元素的最终设置，因此只给一个div一个map。

迪安

更新：很抱歉给出了不正确的信息：从我的循环中出现的任何方法调用都会产生相同的行为：

function pulse(){
     $('#contentDiv').delay(200).fadeOut('slow').delay(50).fadeIn('slow');    
}

从我的循环中调用此方法：

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

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

会多次发出警报，然后执行脉冲？抱歉混淆。

迪安

更新：谷歌地图脚本：

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>

使用showPosition中的警告我可以看到它仅在循环更新元素后才被调用。

为什么a函数的行为与此类似，只能在循环执行其他所有内容后调用？

Answer 1

正如任何人都知道读到这一点有点令人困惑，可能是因为需要学习更多和javascript，尽管你会在评论中看到有一些很好的建议可供我学习。我是如何解决问题的方法：

在循环完成迭代所有其他代码之后，

getLocation（）正在被迭代。所以作为一个hack，当迭代的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中调用方法时，变量y的值都会递增。

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

1 个答案: