jQuery的：循环遍历编号的选择迭代？ [英] jQuery: Loop iterating through numbered selectors?

问题描述

我有一个谷歌地图添加了平移到不同的位置一些简单的按钮。

I have a Google Map with some simple buttons added to pan to different locations.

<input id="loc0" type="button" value="Cape Sable (6)">
<input id="loc1" type="button" value="Florida Bay (3)">

本来我就是用这个code键使按键工作：

Originally, I was using this code to make the buttons work:

var locations = [
    new google.maps.LatLng(25.171, -81.060),
    new google.maps.LatLng(25.211, -80.650) 
];


$('#loc0').click(function(){
    map.panTo(locations[0]);
    map.setZoom(12);
});

$('#loc1').click(function(){
    map.panTo(locations[1]);
    map.setZoom(12);
});

这工作得很好，但我很想写点击功能作为一个循环，所以我没有使用冗余code保持。但我似乎无法找到答案。

This works fine, but I would love to write the click function as a loop, so I don't have to keep using redundant code. But I can't seem to figure it out.

我曾尝试以下内容：

for (i = 0; i < locations.length; i++) {
    $('#loc'+i).click(function() {
        map.panTo(locations[i]);
        map.setZoom(12);
    });

}

但我在尝试使用的按钮时的错误：哑剧：的latLng类型必须经纬度（122超出范围43）。我不精通使用jQuery，所以我怀疑这是一些简单的我还不明白。任何提示？

But I get an error when trying to use the buttons: panTo: latLng must be of type LatLng (122 out of range 43). I'm not well-versed with jQuery, so I suspect this is something simple I don't understand yet. Any hints?

推荐答案

没有立即弹出作为是错的，这看起来应该是正确的。

Nothing immediately pops out as being wrong, this looks like it should be correct.

你能不能把一个JS小提琴演示这个问题呢？

Can you put up a JS Fiddle demonstrating the problem at all?

我的第一个直觉是你的code是正确的，但不知为何，你在的位置阵列中获得数据无效。

My first hunch would be that your code is correct but somehow you are getting invalid data in the locations array.

如果这不是这种情况，我不知道是否是与外壳和变量的问题。像这样的东西可以帮助：

If that's not the case, I wonder if it's an issue with enclosure and the variables. Something like this may help:

for (var i = 0; i < locations.length; i++) {
    var location = locations[i];
    $('#loc'+i).click(function() {
        map.panTo(location);
        map.setZoom(12);
    });
}

我第一个提出了我变量具体到每一个循环的声明，所以没有办法，它可以被覆盖不当别处。我还添加了在每次循环定义位置的变量，这样就可以确保正确的变量，使得它的点击功能的额外的故障安全。

I first made the declaration of the "i" variable specific to each loop, so there's no way that it can get overwritten improperly somewhere else. I also added the additional "fail safe" of defining the "location" variable in each iteration of the loop so that you can ensure the correct variable makes it to the click function.

修改
肯定与机箱上的一个问题，该变量的内容时，通过点击访问。别的东西，你可以尝试是这样的：

EDIT Definitely an issue with enclosure and the variable content when accessed via click. Something else you could try is this:

1：常见的类添加到每个按钮，像类=locButton

1: Add a common class to each button, something like class="locButton"

2：试试这个：

$(".locButton").each(function(){
    $(this).click(function(){
        var locId = parseInt($(this).attr('id').replace('loc',''));
        map.panTo(locations[locId]);
        map.setZoom(12);
    });
});

这篇关于jQuery的：循环遍历编号的选择迭代？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！