0

次のdivをターゲットにしてJQueryで表示/非表示にする方法がわかりません。

JavaScript:

    $("a.more").live("click", function(event){
        event.preventDefault();
        $(this).next('.show-more').toggle();
    });

ドム:

            <p>
                {{beschreibung}}
                (<a class="more" href="{{id}}"><i class="icon-plus"></i>)
            </p>

            <div class="show-more" style="display:none;">
                <p>
                   {{beschreibung_lang}}
               </p>
            </div>

問題がどこにあるのでしょうか？

画面とキーボードの間の障害: TAG を閉じられませんでした (-;

4

4 に答える 4

5

イベント ハンドラーでバインドされる要素はアンカーであり、アンカーには兄弟要素がありません。つまり、next() は機能しません。最初に DOM を一番近い段落までトラバースしてから、次の div などを見つける必要があります。

live()は非推奨でありon()、次のように for dynamic 要素の委任されたバージョンに置き換える必要があります。

$(document).on("click", ".more", function(event){
    event.preventDefault();
    $(this).closest('p').next('.show-more').toggle();
});
于 2012-12-06T17:37:56.813 に答える
3

クリック イベントは でトリガーされます。これaを使用すると、どのクラスの兄弟をnext検索します。beforeを使用して修正するには、 after を検索します。ashow-moreparentnextshow-morep

$(this).parent().next('.show-more').toggle();

于 2012-12-06T17:31:42.877 に答える
2

以下を試してください

 $("a.more").bind("click", function(event){
    event.preventDefault();
    $(this).parent().next('.show-more').toggle();
});
于 2012-12-06T17:31:51.360 に答える
2

アンカー タグと div は兄弟ではないため、parent() を使用してアップする必要があります -

   $("a.more").live("click", function(event){
        event.preventDefault();
        $(this).parent().next('.show-more').toggle();
    });
于 2012-12-06T17:33:05.573 に答える