Javascript 生成多个jquery单击函数

客户端从服务器获取一些图像，然后根据这些图像创建缩略图和图片。当用户点击这些缩略图时，它会做一些事情。但是，从服务器发送的图像数量可以是任意数量。所以现在我被卡住了，我不知道如何生成click函数，而不用像下面那样写出每个函数。有人能在不给我实际答案的情况下引导我走向正确的方向吗

            $("#thumb-0").click(function(){
                index=0;
                switchHouse(index);
            });
            $("#thumb-1").click(function(){
                index=1;
                switchHouse(index);
            });
            $("#thumb-2").click(function(){
                index=2;
                switchHouse(index);
            });
                            ...
            $("#thumb-X").click(function(){
                index=arrayLength;
                switchHouse(index);
            });

我尝试了以下方法，但显然无效：

            for (var i=0; i<topHouse.length; i++){
                $("#thumb"+i).click(function(){
                    index=i;
                    switchHouse(index);
                });
            }

for（var i=0；i这里有一个解决方案

将标记更改为：

<whatever class="thumbnail" data-index="1" />

迭代时，每个函数都会关闭变量
i
。当对函数求值时，
i
的值已到达迭代的末尾。换句话说，当您单击缩略图时，
i
的值为
topHouse.length
，因此函数基本上会设置
index=topHouse.length

尝试使用闭包，以便每个处理程序都有自己的索引值：

for (var i=0; i<topHouse.length; i++){
    $("#thumb"+i).click((function(index) {
        return function() {
            switchHouse(index);
        }
    })(i));
}

对于（var i=0；i您可以使用

为每个图像添加一个具有唯一thumb ID的类，以便使用Jquery将其作为目标

<img id="thumb-25" class="aThumb" src="...">

 $('.aThumb').click(function(e){
var getTheID = $(this).attr('id');
getTheID = getTheID.substring(6);

// switchHouse(getTheID);
  alert(getTheID);
});


$（'.aThumb'）。单击（函数（e）{
var getheid=$（this.attr（'id'）；
getHeid=getHeid.substring（6）；
//配电室（盖特海德）；
警报（GetHeid）；
});
与@Asad的解决方案相同，但这里有一个演示：您缺少
“#thumb”+i中的破折号
应该是
“#thumb-”+i
您能告诉我为什么需要返回函数（）{}，我是个新手this@user308553当然。你看，我们希望能够在特定的迭代中引用
i
的值，而不必让我们的处理程序关闭
i
，并保持其值的最新状态。当我说“关闭”时，我的意思是，如果直接在函数中引用
I
，函数将锁定实际的
I
变量，该变量会随着每次迭代而不断变化。为了避免这种情况，我们将
I
的值传递给匿名函数（在
内部单击
）这将创建所需的处理程序函数并返回它。内部函数将锁定到
索引
参数，该参数的值为
i
@user308553。您应该阅读Javascript中的闭包。这将更清楚。
$( document ).ready(function() {

$("[id^='thumb']").click(function() {
    switchHouse( $(this).index() );  // or add $(this).index()+1

});

<img id="thumb-25" class="aThumb" src="...">

 $('.aThumb').click(function(e){
var getTheID = $(this).attr('id');
getTheID = getTheID.substring(6);

// switchHouse(getTheID);
  alert(getTheID);
});