Question

我一直致力于做一些简单的事情......但不确定最好的做法。我已经准备好了jQuery文档，但是因为这个地方提供了合理的建议 - 我会在这里提出问题。

它基本上是遍历。

假设我将此最小代码作为一个简单示例（同一页面上的多个元素）：

<div class='collab'>
<div class='collab_text'>text</div><!--close collab_text-->
</div><!--close_collab-->

<div class='collab'>
<div class='collab_text'>text</div><!--close collab_text-->
</div><!--close_collab-->

在jQuery中，我只想在悬停时淡出collab_text。所以我有：

$(".collab").hover(function(){
        $(".collab_text").fadeTo(700, 1.0);
    },function(){
        $(".collab_text").fadeTo(300,0.00001);                          
    });

当我将鼠标悬停在1个项目上时，这显然会显示所有元素的collab_text。所以我的问题是，只有悬停的collab_text显示的正确方法是什么。 .next()？，.find()？

我知道我的代码应该是：

$(".collab").hover(function(){
            $(this).XXX(".collab_text").fadeTo(700, 1.0);
        },function(){
            $(this).XXX(".collab_text").fadeTo(300,0.00001);                            
        });

非常感谢任何信息。

感谢。

Answer 1

您可以使用find或$()上下文

$(this).find(".collab_text").fadeTo(700, 1.0);

或

$('.collab_text', this).fadeTo(700, 1.0);

他们都是平等的：

在内部，选择器上下文是使用.find（）方法实现的，所以$（'span'，this）相当于$（this）.find（'span'）。

http://api.jquery.com/jQuery/

Answer 2

在你的情况下，我会使用children('.collab_text')：

$(".collab").hover(function(){
    $(this).children(".collab_text").fadeTo(700, 1.0);
},function(){
    $(this).children(".collab_text").fadeTo(300,0.00001);                          
});

示例 - http://jsfiddle.net/edjQ7/

jQuery遍历 - 最好的使用方法？

2 个答案: