Javascript 循环和静态num

我有一个循环要通过我的按钮来给它一个悬停状态，但我似乎不知道如何修复函数中的“I”在循环时的状态。好吧，这不是一个很好的解释我想要实现什么的方法，也许代码会更清晰

（i=1；i<4；i++）的

{
$（'#按钮#'+i）.悬停（函数（）{
$（本）；
}，函数（）{
$（this.text（'Button'）；
});
};

按钮
按钮
按钮
悬停给您数字4，因为变量
i
在循环结束时的值是4，所以当悬停被触发时，您将获得第4张图像。您可以通过在循环后将变量
i
初始化为5来检查这一点，然后将图像悬停为
s3-b5b.png

不用循环，你可以试试这个

提及

使用以下方法解决此问题：


（i=1；i<4；i++）的
{
$（“#场景-3.选择图像：第n个子（“+i+”））。悬停(
（功能（值）{
返回函数（）{
$（this.attr（'src'，'img/s3-b'+value+'b.png'）；
}
})(一)
，（函数（值）{
返回函数（）{
$（this.attr（'src'，'img/s3-b'+value+'.png'）；
}
})（i） ）；
};这可能不是您想要的，但这是修复代码的另一种方法

在迭代中，“i”最终将是4，这就是为什么所有按钮都显示4。如果将其更改为
$（this）.text（this.id）然后它就可以工作了


（i=1；i<4；i++）的
{
$（'#按钮#'+i）.悬停（函数（）{
$（this.text）（this.id）；
}，函数（）{
$（this.text（'Button'）；
});
};

按钮
按钮
按钮
如果您希望以类似于当前代码的方式执行此操作，则非常简单。只需在循环中调用函数，将
i
变量传递给它，然后在该函数中设置
hover（）
回调。对代码的唯一更改是函数调用和函数定义：


（i=1；i<4；i++）的
{
设置悬停（i）；
}
函数设置悬停（i）{
$（'#按钮#'+i）.悬停（函数（）{
$（本）；
}，函数（）{
$（this.text（'Button'）；
});
};

按钮
按钮
按钮
以下是另一种更具动态性的方法：


$（函数（）{
变量按钮选择器字符串='#按钮>h1'；
var defaultButtonText='Button'；
变量迭代器=函数（索引，元素）{
var mouseEnterAction=函数（事件）{
$（event.target）.text（索引+1）；
};
var mouseLeaveAction=函数（事件）{
$（event.target）.text（defaultButtonText）；
};
$（元素）
.on（'mouseenter'，mouseEnterAction）
.on（'mouseleave'，mouseLeaveAction）；
};
$（按钮选择器字符串）。每个（迭代器）；
});

按钮
按钮
按钮
对我来说，它看起来不错。您是否尝试了选择器是否正常工作？是的，选择器正常工作，因此所有3个图像都有滚动。但它们都滚动到同一个第三个图像。这意味着选择器连接到1、2、3。但是函数的i，都停留在数字3上。您是否在事件处理程序中检查了
this
的值？你能添加一个HTML代码段吗？@Kelvin Zhao如果你添加HTML代码段，我们可以确定你使用的选择器名称。@Kelvin Zhao我注意到你从未接受过任何答案。你应该考虑接受答案，如果它解决了你的问题，实现结果的好方法！它还保存/切断了循环。但我仍然想知道，当I运行到循环创建的hover函数中时，如何使它成为静态的。嗯，嗯…“但是我仍然想知道，当I运行到循环创建的悬停函数中时，如何使I保持静态。”请告诉我，我不明白。您的变量i应该是动态的，基于您悬停的元素，以便它可以在循环创建的函数中使用。感谢您的回复！我将使用你的方法进行悬停。我的意思是，有没有办法使每个I固定在hover函数中，使其为1、2、3，而不是全部为4。一种方法是在循环期间将元素中的变量I保存为属性，并在hover时使用它。我个人认为依赖它的索引是个坏主意，因为它可能在应用程序的后续改进中发生变化，这使得在这些按钮之间实现其他元素变得困难且不那么灵活哇，太棒了，文章不错。这真是一个有趣的问题！您可以进一步简化此操作
（函数（值）{return function（）{…}）（i）
可以是
（值）=>function（）{…}（i）
看起来像C#@MilanTomeš中的lambda，或多或少是这样的
（）=>expr
是一个不带参数的函数，在执行时，计算并返回
expr
。它不能像
函数
那样使用
这个
对象，因此当您不需要它时，可以使用lambda语法来节省空间/可读性。这是一个正确的函数语法，你也可以做
（）=>{return expr}
，但这并没有那么有趣：）我在这个问题上学到了很多！谢谢大家的建议和链接@Michael Greary实际上，在您的示例中，我不需要调用setupHover函数，我还可以将其作为一个未命名的函数插入并在循环时运行，对吗？有什么技术上的原因不应该这样做吗？你确实是对的！您可以使用匿名函数并在循环中直接调用它。无论是像我的示例中那样调用命名函数，还是内联调用匿名函数，您都在做完全相同的事情。在这两种情况下，都是调用函数的行为创建了闭包。（很高兴你发现我的答案和其他答案都很有帮助——听到不同的观点，看到解决问题的不同方法，真是太好了。）
$('#scene-3 .selection img').hover(function () {
    $( this ).attr( 'src', 'img/s3-b'+parseInt($(this).index() + 1)+'b.png' );
}, function () {
    $( this ).attr( 'src', 'img/s3-b'+parseInt($(this).index() + 1)+'.png' );
});