jquery - Jquery：如何在 ul 中使用它

Question

我想我不明白 jQuery 中“this”的用法。如果我想在悬停到 ul 的任何元素时发生某些事情。我怎么用这个？

这个例子住在这里：http: //jsfiddle.net/WREjV/

HTML：

<ul class="menu">
    <li id="first">first</li>
    <li id="second">second</li>
</ul>

查询：

$(function(){
    $("#menu").hover(function() {
        $(this).fadeOut("slow");

    },function() {
        $(this).fadeIn("slow");
    });

    /* This works:
    $("#first").click(function() {
        $("#first").fadeOut("slow");
    });
    */
})

score 3 · Accepted Answer

您正在使用 ID 选择器 ( #menu) 而不是类选择器 ( .menu)。

改变它，它会工作：

$(".menu").hover(function() {
    $(this).fadeOut("slow");

    },function() {
        $(this).fadeIn("slow");
});

http://jsfiddle.net/WREjV/4/

score 2 · Accepted Answer

http://jsfiddle.net/WREjV/1/

您在提供类时必须使用#menu（指元素的 ID）选择器.menu，因此选择器将是$(".menu")

$(function(){

    $(".menu").hover(function() {
         $(this).fadeOut("slow");

    },function() {
        $(this).fadeIn("slow");
    });


})

score 1 · Accepted Answer

试试这个 http://jsfiddle.net/WREjV/2/

对于 ul 中的所有元素

$(function(){
    $(".menu li").hover(function() {
        $(this).fadeOut("slow");

    },function() {
        $(this).fadeIn("slow");
    });
    })

score 1 · Accepted Answer

此外，如果您指示 LI 元素在悬停时淡出，则将没有任何东西可以悬停以触发淡入。

score 1 · Accepted Answer

<ul class="menu">
    <li id="first">first</li>
    <li id="second">second</li>
</ul>


$(function(){
        $(".menu li").hover(function() {
            $(this).fadeOut("slow");
        },function() {
            $(this).fadeIn("slow");
        });

        /* This works:
        $("#first").click(function() {
            $("#first").fadeOut("slow");
        });
        */
    })

这里1) "menu" is a class so use want to use '.' not '#' 2) You want to do hover for li, so you want to mention the li as well.

score 0 · Accepted Answer

您正在使用作为 ID 引用的哈希 #，因此您的代码正在寻找 ID 为“menu”的元素。我已修改代码以使用表示类名的句点 (.)

$(function(){

    $(".menu").hover(function() {
         $(this).fadeOut("slow");

    },function() {
        $(this).fadeIn("slow");
    });


})

看这里小提琴

score 0 · Accepted Answer

您的标记中有一个类，class="menu">但您用 id 表示它，$("#menu")您应该在标记或 js 中进行一次更改更改class为id或使用.表示类选择器而不是#表示 ID 选择器。

要么更改标记：

<ul id="menu">
  <li id="first">first</li>
  <li id="second">second</li>
</ul>

或者在js中：

$(".menu").hover(function() {
    $(this).fadeOut("slow");
},function() {
    $(this).fadeIn("slow");
});

score -1 · Accepted Answer

您必须悬停所有元素。为此，请更改选择器以包含 li

$(function(){
$(".menu li").hover(function() {
    $(this).fadeOut("slow");

},function() {
    $(this).fadeIn("slow");
});
})

jquery - Jquery：如何在 ul 中使用它

8 回答 8

要么更改标记：

或者在js中：

Related

Reference