1

私はグーグルで調べて、人々がjQueryプラグインでsetTimeoutを試みているという同様の問題に出くわしましたが、答えに苦労しているため、これは怠惰な投稿ではありません.

一部のコンテンツを非表示にするために animate を呼び出すのを遅らせようとしています。たとえば、ユーザーがある領域にカーソルを合わせると、さらにいくつかのコンテンツが表示され、元のコンテンツが非表示になります。次に、ユーザーが 2 秒後にマウスを離すと、元のコンテンツが返されます。

タイムアウトを無視しても、アニメーションは期待どおりに機能します。これは私が頭を悩ませることができないものです！

コードに関するご支援は、いつものように大歓迎です!

アニメーションに焦点を当てた簡略化されたコードを次に示しますが、プラグイン構造はそのまま残しています: -

;(function($){
$.fn.extend({         
    pluginName: function(options) {
        // - Settings list and the default values           
        var defaults = {
            width: this.css('width'),
        };

        var options = $.extend({}, defaults, options);   

        return this.each(function() {

        // --  Globals
            var o = options;    
            var timeoutID;

        function deceptionAnimate(display) {
            if(display == 1) {
                obj.clearQueue().animate({
                                        'top': 0,
                                        'left': -o.width 
                                        }, o.interval, o.easing);               
            } else if(display == 0) {
                obj.clearQueue().animate({
                                        'top': 0,
                                        'left': 0
                                        }, o.interval, o.easing)                
            } 
        }

        function delaydeceptionAnimate () {
            timeoutID = window.setTimeout(deceptionAnimate(0), 2000);
        }

        // ---- Initiate
        function init() {   
                        // ----- Animate

                        $(document).on(o.eventTrigger, wrapperID, function() {
                            deceptionAnimate(1);
                        });
                        $(document).on('mouseout', wrapperID, function() {
                            delaydeceptionAnimate(0);
                        });     
        }       
        // Call
        init();

        });
    }
});
})(jQuery);
4

2 に答える 2

4 
window.setTimeout(deceptionAnimate(0), 2000);

パラメータを使用して呼び出し 、その戻り値（）を呼び出される関数としてに渡します。deceptionAnimate0nullsetTimeout

この特定のケースでは、次deceptionAnimteのように書き直すことができます。

function deceptionAnimate(display) {
    if( display) { /* code to show box */ }
    else { /* code to hide box */ }
}

次に、これを使用します。

window.setTimeout(deceptionAnimate, 2000);

ただし、より一般的なケースでは、遅延する関数に引数を渡すには、無名関数を使用します。

window.setTimeout(function() {deceptionAnimate(0);}, 2000);
于 2013-02-21T15:59:24.853 に答える
0

タイムアウト関数呼び出しの書き方には注意が必要です。ここでは、関数属性として setTimeout 関数に渡すのではなく、実際に DelayedDeceptionAnimate を呼び出しています。

そのブロックを次のように書き換えてみてください。

function delaydeceptionAnimate () {
    timeoutID = window.setTimeout(function() {
        deceptionAnimate(0);
        }, 2000);
}

このようにして、delayedDeceptionAnimate 関数を呼び出すコールバック関数を渡します!

于 2013-02-21T16:06:59.260 に答える