jquery - Jquery:これをulで使用する方法

Question

jQueryでの「this」の使い方がよくわからないと思います。ul の任意の要素にカーソルを合わせたときに何かを実行したい場合。これをどのように使用しますか？

HTML:

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

Jクエリ:

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

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

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

score 2 · Accepted Answer

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

クラスを提供するときに使用する必要がある（要素のIDを参照する）セレクターを使用したため、セレクター#menuは.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 0 · Accepted Answer

ID への参照である # ハッシュを使用しているため、コードは ID "menu" を持つ要素を探しています。クラス名を表すピリオド (.) を使用するようにコードを変更しました。

$(function(){

    $(".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

Related

Reference