0

私のプロジェクトには、クラス名が同じ（.expand）のいくつかのli要素があります

私の目標は、ユーザーがタブキーを押すと、li.expaned の下にある非表示のサブメニューが表示されることです。

問題は、タブキーを押すと、すべてのサブメニューが表示されることです.1つずつ表示するにはどうすればよいですか?

$(document).ready(function () {
    $('.expanded').keyup(function (e) {
        $('.expanded').each(function () {
            console.log('keyup called');
            var code = e.keyCode || e.which;

            if (code == '9') {
                //jQuery(this).children('.side_menu_sub li ul').css("display", "block");
                $(this).children('.side_menu_sub li ul').css("display", "block");
            }
        });
    });
});
4

1 に答える 1

0

これを試して：

$(this).find('> .side_menu_sub > li > ul').css("display", "block");

それらを使用して選択した要素をいつでも確認できconsole.logます。CSSセレクターをいじってみてください。

また、再利用された jQuery オブジェクトを変数に格納することをお勧めします。on特定の関数の代わりに使用する必要があります。結果は次のようになります。

$(document).ready(function () {
    expanded = $('.expanded');
    expanded.on('keyup', function (e) {
        expanded.each(function () {
            console.log('keyup called');
            var code = e.keyCode || e.which;

            if (code == '9') {
                //jQuery(this).children('.side_menu_sub li ul').css("display", "block");
                $(this).find('> .side_menu_sub > li > ul').css("display", "block");
            }
        });
    });
});
于 2012-08-29T08:02:42.460 に答える