1
$(document).ready(function() {
    $("ul li").click(function() {
        $(this).find("p").slideToggle("normal");
        return false;
    });
});

このjQueryコードを使用して、要素をスライドインおよびスライドアウトさせることができます。しかし、問題は、誰かが本当に速くクリックすると、スライドアウトは、最後に到達した高さの最大高さに到達するまでしか移動しないことです。

したがって、誰かが本当に速くクリックすると、要素は数ピクセルだけスライドして上にスライドします。もう一度クリックしてスライドさせると、前回到達した最大の高さまでスライドします。

誰かがこの問題を修正してこの作業を適切にするのを手伝ってもらえますか?

PS:p要素の高さはautoに設定されているため、内部のコンテンツの高さと自動的に一致します(この詳細が答えに役立つかもしれません)。

4

3 に答える 3

1

clickクリックイベントを添付する関数を使用する代わりに、代わりに次を使用しoneます。

$("ul li").one("click", doStuff);

function doStuff(){ 
   // do your stuff here
   $("ul li").one("click", doStuff); // Re-attach event
}

次に、関数にイベントを再アタッチします。

于 2012-04-23T14:50:14.180 に答える
0

これを試して:

$(document).ready(function() {
    $("ul li").click(function() {
        if ( ! $(this).find('p:animated').length)
        {
            $(this).find("p").slideToggle("normal");
            return false;
        }
    });
});
于 2012-04-23T14:51:13.540 に答える
0

追加のクリックを(無視するのではなく)実際に処理する場合は.stop(true, true)、前のアニメーションを停止して最後にジャンプし、次のアニメーションを希望どおりに実行できるようにします。

$(document).ready(function() {
    $("ul li").click(function() {
        $(this).find("p").stop(true, true).slideToggle("normal");
        return false;
    });
});

.stop()ユーザーのクリックからアニメーションをトリガーするときはいつでも、特定の状況でどの引数を使用するかを知って理解する必要があります。これがないと、アニメーションがキューに積み重なって順番に実行される可能性がありますが、これは通常、必要なものではありません。

これがjQueryのリファレンス情報.stop()その引数です。

于 2012-04-23T15:17:38.910 に答える