jQuery＆＃8220;：animated＆＃8221;はセレクターは、fadeIn（）およびfadeOut（）を使用するアイテムと一致しますか？

Question

アニメーションの実行中にリストアイテムがクリックされないようにしています。そこで、クリックハンドラーの一番上で、次のようなことをしたいと思います。

if(!$(this).is(:animated)) {
    // handle click code here
}

上記のifステートメントの 'bang'（！）に注意してください。私はテストしていませんが、これはうまくいくと思います。私が確信していないのは、fadeIn（）およびfadeOut（）でアニメーション化されている要素に対して実行されたときに '.is（：animated）'がtrueを返すかどうかです。 jQueryには.animate（）関数があり、：animatedはその関数を使用してアニメーション化された要素に対して確実に機能すると仮定していますが、fadeIn（）およびfadeOut（）を使用する要素では機能しますか？ありがとう。

更新：劇的な誤投稿の後、すべてが順調になり、すばらしいフォローアップと編集を行ってくれたレスポンダーのおかげです。最終的に、jQueryソースは.animate（）を使用してこれらの効果を実現するため、：animatedはfadeIn（）およびfadeOut（）を使用してアニメーション化された要素と一致することがわかりました。私の最後のチェックは最初に投稿されたとおりでした：

<*>

... not（）を使用するのではなく、いくつかの例で提案されています（これらは現在投稿されているように機能すると思います）。どうもありがとう。

Answer 1

はい、：animated はjQueryが作成するあらゆる種類のアニメーションに対してtrueを返します。また、jQueryの animate 関数を使用する場合、アニメーション化するプラグインに対しても実行されます。

ただし、jQueryを利用するために、ほんの少しだけコードを書くことができます。

編集 not 関数は、 is の反対ではありません。ノードを除外しますが、 true と評価されるjQueryオブジェクトを返します。最初に提案したように not 関数を使用するには、テストに .length を追加する必要があります。

if( $(this).not(':animated').length ) {
    // Handle click code here
}

それ以外の場合は、OPが最初に投稿されたとおりに関数を使用します：

if( !$(this).is(':animated')) {
    // Handle click code here
}

Answer 2

：animate は、 fadeOut が呼び出された要素と一致します。

jQueryソースを見ると、 fadeOut は単に animate を呼び出していることがわかります。
次のように定義されています：

// Generate shortcuts for custom animations
jQuery.each({
    slideDown: genFx("show", 1),
    slideUp: genFx("hide", 1),
    slideToggle: genFx("toggle", 1),
    fadeIn: { opacity: "show" },
    fadeOut: { opacity: "hide" }
}, function( name, props ){
    jQuery.fn[ name ] = function( speed, callback ){
        return this.animate( props, speed, callback );
    };
});

Answer 3

そこにifステートメントを含める必要はまったくありません。 「クリックコード」の前に.not（ '：animated'）をチェーンできます。

例として、これらのフェードは、divがアニメーション化されていない場合にのみ機能するため、厄介なキューの問題を取り除きます。

$('a#show_me').toggle(function() {
    $('div#the_money').not(':animated').fadeIn();
}, function() {
    $('div#the_money').not(':animated').fadeOut();
});

.click（）でも同様に機能します。