Question

我正在使用.each() jQuery函数和$(this)选择器来实现一个悬停的div，但由于给定的div彼此接近，$(this)选择器会选择更多如果我移动鼠标的速度太快，那么就会超过一个元素。

有没有办法确保强制$(this)不要选择多个元素？

这是我的HTML：

<div class="row">
   <div class="col-md-4 donation 180">
      <div class="box">
         <div class="cover">
            <h2>Freedom<br>Package</h2>
         </div>
         <form class="form"></form>
      </div>
   </div>
   <div class="col-md-4 donation 200">
      <div class="box">
         <div class="cover">
            <h2>Sovereignty<br>Package</h2>
         </div>
         <form class="form"></form>
      </div>
   </div>
   <div class="col-md-4 donation 400">
      <div class="box">
         <div class="cover">
            <h2>Royalty<br>Package</h2>
         </div>
         <form class="form"></form>
      </div>
   </div>
</div>

这是我的jQuery：

if($(window).width() < 800 ) {
    $(".form").show();
    $(".cover").hide();
} else {
    $(".donation").each(function() {
        $(this).hover(function() {
            $(this).children($(".box")).addClass("animated flipInY");
            $(this).children($(".box")).children($(".cover")).fadeOut("", function() {
                $(this).siblings($(".form")).show();
            });
        }, function() {
            $(this).children($(".box")).removeClass("animated flipInY");
            $(this).children($(".box")).children($(".form")).fadeOut("", function() {
                $(this).siblings($(".cover")).show();
            });
        });
    });
}

感谢您的帮助，谢谢！

Answer 1

您不需要使用$(this)。您可以使用每个值。

$(".donation").each(function(i, val) {
  alert($(val).attr('class'));
});

jQuery $（this）选择器意外地选择了多个元素

1 个答案: