1

jQuerynext()メソッドを使用しようとすると、では機能しませんlive()。

まず、私のコードは次のとおりです。

$(".toggle_button").live('click', function() {
    $(this).html($(this).html() == '-' ? '+' : '-');
    $(this).next(".info_section").toggle(400);
});

これがHTMLです

<div class='section_toggle_container'>
    <div class='toggle_button'>-</div>
    <strong>Driver Information:</strong>
</div>
<div class='info_section'>
    info here
</div>

.toggle_button問題は、ネストされて到達不能になるという事実にあるのでしょ.info_sectionうか？

live()2行目は、イベントを指定して要素を変更しているため、うまく機能します。ただし、3行目は、問題が発生している場所です。これは、を使用しているためnext()です。

誰かが私のnext()問題の解決策を手伝ってくれますか？

4

2 に答える 2

3

HTMLを見ると、次のようなことはできません。

$(this).next(".info_section").toggle(400);

なれ：

$(this).parent().next(".info_section").toggle(400);
于 2011-01-17T23:43:30.863 に答える
1

実用的な答えがありますが、との切り替えについての提案を残したい-と+思いtext()ます。HTMLの代わりに、固有のtext（for text()、htmlfor html()）を使用することをお勧めします。

$(".toggle_button").live('click', function() {
    $(this).text(function(index,text) {
        return text == '-' ? '+' : '-';
    });
    $(this).parent().next(".info_section").toggle(400);
});

さらに、キャッシュを作成することをお勧めし$(this)ます。複数回呼び出す場合は、キャッシュを使用して、後で再作成する必要がないようにする価値があります。これにより、次のことが可能になります。

$(".toggle_button").live('click', function() {
    var $this = $(this);
    $this.text(function(index,text) {
        return text == '-' ? '+' : '-';
    });
    $this.parent().next(".info_section").toggle(400);
});

もちろん、1.7より大きい、または1.7を含むバージョンのjQueryを使用している場合はon()、（jQuery 1.7以降）廃止されたメソッドではなく、メソッドを使用する必要があります。これにより、次のlive()ようになります。

$(".toggle_button").on('click', function() {
    var $this = $(this);
    $this.text(function(index,text) {
        return text == '-' ? '+' : '-';
    });
    $this.parent().next(".info_section").toggle(400);
});

これは実際には単なるアドバイスですが、残念ながら、理解できないコードがコメントに貼り付けられるのを防ぐための回答として投稿されています。

参照：

于 2012-07-31T16:54:35.137 に答える