Javascript 迭代时如何将数组值设置为函数参数

我使用谷歌地图API在地图上显示标记

每个标记都指向地图上的一家商店

我的问题是为每个标记创建事件处理程序，当单击给定标记时，它将显示工具提示，其中包含有关商店的信息

我使用文本输入让用户键入城市，并使用jquery处理附近提交按钮上的单击事件。然后我将查询发送到php站点，返回以下对象：

d: Object
error: false
lat: "52.3744440000"
lng: "9.7386110000"
shop: Array[2]
0: Object
address: "Addressstreet 12"
lat: "52.3761209000"
lng: "9.7387242000"
name: "Shop 1"
tel: "1234"
__proto__: Object
1: Object
length: 2
etc.

现在，我使用lat和lng值作为城市坐标，将地图居中。 然后我将shop数组发送到paintShops（shops）方法：

功能油漆车间（车间）{
对于（变量i=0；i

我的问题出现在上面代码片段的最后一行：当我单击标记时，displayShopTooltip的参数tel和地址未定义。 我想知道怎样做才不会有这个问题，或者另一种方法。

---

提前感谢。

美元.each（）函数与美元（选择器）.each（）不同，后者用于以独占方式迭代jQuery对象。美元.each（）函数可用于迭代任何集合，无论它是映射（JavaScript对象）或者数组。对于数组，回调每次都会传递一个数组索引和相应的数组值。（也可以通过this关键字访问该值，但Javascript将始终将this值包装为对象，即使它是一个简单的字符串或数字值。）该方法返回其第一个参数，即迭代的对象。

您已将

tel

和

address

定义为单击处理程序的参数，这没有意义。您可能想访问全局变量：

google.maps.event.addListener(son, 'click', function(son) {
    displayShopTooltip(son, tel, address);
}

尽管如此，这样只能有一个店铺（只有一个全局

tel

和

address

）。请使用局部变量和闭包：

function paintShops(shops) {
    for (var i = 0; i < shops.length; i++) {

        (function() {            
            var kl = shops[i];
            var ka = parseFloat(kl.lat);
            var kb = parseFloat(kl.lng);            
            var tel = kl.tel;
            var address = kl.address;

            var son = new google.maps.Marker({
                position: new google.maps.LatLng(ka, kb),
                map: map,
                title: kl.name,
                clickable: true
            });

            google.maps.event.addListener(son, 'click', function(son) {
                displayShopTooltip(son, tel, address);
            }
        })();
    }
}

功能油漆车间（车间）{
对于（变量i=0；i

您遇到的问题是，通过在侦听器中声明tel和address，您在事件处理程序回调中将它们设置为undefined（因为没有传递任意参数的机制）。解决方案是确保处理程序在与相同的范围内（即，包装在函数中）标记。我建议阅读javascript中的作用域，因为您还犯了一两个错误（例如，没有正确声明变量）——javascript中的作用域处理方式与其他编程语言非常不同，需要一点时间来适应

function paintShops(shops){
  for (var i = 0; i < shops.length; i++){
    makeMarker(shops[i]);
  }

  function makeMarker(kl) {
    var ka = parseFloat(kl.lat);
    var kb = parseFloat(kl.lng);
    var tel = kl.tel;
    var address = kl.address;
    var son = new google.maps.Marker({
       position: new google.maps.LatLng(ka, kb),
       map: map,
       title: kl.name,
       clickable: true
    });
     google.maps.event.addListener(son, 'click', function(son) {
       displayShopTooltip(son, tel, address);
     }
   }

功能油漆车间（车间）{
对于（变量i=0；i

看起来好像他并没有使用jQuery？@Dev:你们的帮助并没有帮助我。谢谢，这是一个完美的解决方案。现在我意识到我的错误，并没有正确地声明错误。谢谢。你们的解决方案也很有效。为了成功地执行你们的代码，我必须更改最后但只有两行：}）（）；我很高兴您和wheresrhys的快速响应。

function paintShops(shops){
  for (var i = 0; i < shops.length; i++){
    makeMarker(shops[i]);
  }

  function makeMarker(kl) {
    var ka = parseFloat(kl.lat);
    var kb = parseFloat(kl.lng);
    var tel = kl.tel;
    var address = kl.address;
    var son = new google.maps.Marker({
       position: new google.maps.LatLng(ka, kb),
       map: map,
       title: kl.name,
       clickable: true
    });
     google.maps.event.addListener(son, 'click', function(son) {
       displayShopTooltip(son, tel, address);
     }
   }