0

jQueryプラグインで起動される要素にタイムアウトを設定しようとしています。このタイムアウトは、条件に応じて関数で再度設定されます。ただし、別の要素を設定する前に（プラグインを再起動した場合）、この要素のタイムアウトをクリアするか、手動でクリアしたいと思います。

<div id="aaa" style="top: 0; width: 100px; height: 100px; background-color: #ff0000;"></div>

これが私のコードです（現在http://jsfiddle.net/Ppvf9/にあります）

$(function() {

    $('#aaa').myPlugin(0);

});



(function($) {


$.fn.myPlugin = function(loops) {

    loops = loops === undefined ? 0 : loops;

    this.each(function() {

        var el = $(this),
            loop = loops,
            i = 0;

        if (loops === false) {
            clearTimeout(el.timer);
            return;
        }

        var animate = function() {
            var hPos = 0;
            hPos = (i * 10) + 'px';

            el.css('margin-top', hPos);
            if (i < 25) {
                i++;
            } else {
                if (loops === 0) {
                    i = 0;
                } else {
                    loop--;
                    if (loop === 0) {
                        return;
                    } else {
                        i = 0;
                    }
                }
            }

            el.timer = window.setTimeout(function () {
                animate();
            }, 1000/25);

        };

        clearTimeout(el.timer);

        //$('<img/>').load(function() {
            // there's more here but it's not very important
            animate();
        //});

    });
    return this;

};


})(jQuery);

作る$('#element').myPlugin();と発売されます。2回目に作成すると、2つのタイムアウトが発生します（$('#aaa').myPlugin(0); コンソールで実行して確認してください）。そして、これをでクリアできるようにしたいと思い$('#element').myPlugin(false);ます。

私は何が間違っているのですか？

編集：アクセスする2つの変数を設定して解決thisし$(this)ました：http：//jsfiddle.net/Ppvf9/2/

4

1 に答える 1

0

try saving the timeout handle as a property of the element. Or maintain a static lookup table that maps elements to their timeout handles.

Something like this:


el.timer = window.setTimeout(...);

I assume you need one timer per element. Not a single timer for all elements.

于 2012-06-27T15:54:04.430 に答える