2

我正在使用悬停功能将鼠标悬停在菜单中。我已经使用它的类选择了一个特定的元素。要仅更改该元素而不是该类的所有元素，我可以使用“this”。但我想更改该类元素内的 h3 标签。再次是我悬停在上面的那个，而不是所有具有该类名的元素。

我尝试在“this”之后使用 > 元素，但它不起作用。

我怎么做？我希望我已经解释得足够好。我希望你理解使用代码。

$('.slide').hover(
    function(){
        $(this>'h3').animate({
            height: '100%'
        });
    },
    function(){
        $(this>'h3').animate({
            height: '25px'
        });
    }
);

所有答案表示赞赏。谢谢

4

6 回答 6

4

你.find()用来获取<h3>里面的元素this。

$('.slide').hover(
    function(){
        $(this).find('h3').animate({
            height: '100%'
        });
    },
    function(){
        $(this).find('h3').animate({
            height: '25px'
        });
    }
);

如果<h3>是直接孩子，则使用效率更高.children()：

$(this).children('h3').animate({
于 2010-08-26T19:35:11.590 回答
2

尝试这个：

$(this).children('h3').animate();
于 2010-08-26T19:36:01.700 回答
1

利用：

$(this).find('h3')

或者：

$(this).children('h3')
于 2010-08-26T19:35:28.080 回答
1

尝试$(this).find("h3")代替$(this>'h3').

于 2010-08-26T19:35:57.253 回答
1

你应该使用 $(this).find('h3')

  $('.slide').hover(
    function(){
        $(this).find('h3').animate({
            height: '100%'
        });
    },
    function(){
        $(this).find('h3').animate({
            height: '25px'
        });
    }
);

或者，如果您只希望 h3:s 直接位于 .slide 下方，则可以使用

$(this).children('h3')
于 2010-08-26T19:41:07.750 回答
0

以上所有答案都是正确的。您的选择器不起作用的原因是普通的“this”关键字指向实际的 DOM 元素。您必须像这样将“this”本身包装在一个 jQuery 对象中：$(this)，然后才能在其上使用任何 jQuery 方法。

于 2010-08-26T19:54:47.357 回答