0

jQuery の理解に問題があります。

jqueryを介して作成されたいくつかの動的Li要素を持つULがある場合、最初のliにクラスが選択されるように設定されます-たとえば

<li class='selected'>text</li>

UDPATE を編集:

わかりました..だから私が持っているのは、テキスト ボックスから動的に生成される REST 呼び出しから動的に生成される LI のセットです。私がする必要があるのは、基本的に入力（キーアップ）した後、いくつかの結果が表示されることです（オートコンプリートに似ています）。次に、検索ボックスのコンテキスト内で上下の矢印を検出し、「.selected」クラスをツリ​​ーの上下に移動する必要があります。以下のコードは、動的に作成されたリストではなく、静的リストに対して機能します。

いくつかのサンプルコード:

$('.txtSearchBox')
.unbind('keypress keyup')
.bind('keypress keyup', function (e) {
    if ($(this).val().length < 3 && e.keyCode != 13) {
        $('.searchWrapper').hide();
    } else {
        $('.searchWrapper').show();
        SearchAutoComplete.init($('.searchWrapper'));
        SearchAutoComplete.load();
    }

    if (e.keyCode == 38) { // up
        var selected = $(".selected");
        $(".searchWrapper li").removeClass("selected");
        if (selected.prev().length == 0) {
            selected.parent().children().last().addClass("selected");
        } else {
            selected.prev().addClass("selected");
        }
    }
    if (e.keyCode == 40) { // down
        var selected = $(".selected");
        $(".searchWrapper li").removeClass("selected");
        if (selected.next().length == 0) {
            selected.parent().children().first().addClass("selected");
        } else {
            selected.next().addClass("selected");
        }
    }
});

$(".searchWrapper li").live('mouseover', function (e) {
    $(".searchWrapper li").removeClass("selected");
    $(this).addClass("selected");
});

ご覧のとおり、このコードは上下の矢印キーを検出します。問題は、動的要素の場合、これは何もしません。on イベントは a ではなく li にあるはずなので、私は混乱していますか?

ありがとう

クリス

4

2 に答える 2

0

これはあなたが意味したものですか？デモ

eachを使用すると、要素を反復処理して、必要に応じて操作できます。

$('ul.alist li').on('click', function(){

jQuery.each($('ul.alist li'), function() {
  $(this).removeClass('selected');

});
});

上記のコードでは、li タグを繰り返し処理し、「選択した」クラスを削除するだけです。

于 2012-08-25T23:08:26.287 に答える
0

これを試して：

$(".searchWrapper ul").on('mouseover',"li", function () {
    $(".searchWrapper li").removeClass("selected");
    $(this).addClass("selected");
});

関数 ("li")にセレクターを提供すると、JQueryドキュメントon()から、イベント ハンドラーが委任されます。

于 2012-08-25T23:10:32.267 に答える