Question

好吧我有6个按钮，当你将鼠标悬停在6个按钮中的一个上时，我试图拥有一个jquery监听器，它会改变类。我使用for循环执行此操作，继承我的代码：

$(document).ready(function() {
for($i=1;$i<7;$i++) {
      $('#button'+i).hover(function() {
        $(this).addClass('hovering');
      }, function() {
        $(this).removeClass('normal');
      });
}  
});

每个按钮的id为“buttonx”（x为数字）

帮助？

Answer 1

您不需要遍历一堆生成的ID。您可以简单地为每个人提供“正常”课程，并且：

$("button.normal").hover(function() {
    $(this).addClass("hovering");
}, function() {
    $(this).removeClass("hovering");
});

'button.normal'将返回带有'normal'类的所有按钮的集合，因此不需要循环，hover事件将应用于集合中的每个元素。

Answer 2

您不需要使用循环。只需在id上使用属性startsWith选择器即可。此外，您可能希望更改应用/删除类的方式，以确保没有类同时具有正常和悬停。

$('[id^=button]').hover( function() {
     $('[id^=button]').removeClass('hovering');
     $(this).addClass('hovering').removeClass('normal');
},
function() {
     $(this).removeClass('hovering').addClass('normal');
});

Answer 3

请注意，karim79的答案是一个很好的方法。

在您的代码中，您将循环计数器声明为'$ i'，但尝试引用'i'。它应该是$（'＃button'+ $ i）

jquery循环悬停按钮

3 个答案: