Question

我正在开发一个使用SetInterval的自定义jQuery插件，但是当它被多次调用时会中断。

我有类似的东西：

(function($){
    $.fn.myplugin = function(options) {

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

        this.each(function() {
            //etc.
            interval = setInterval(function(){ doMyOtherFunc(options); }, 1000);
        });

        function doMyOtherFunc(options) {
            //etc
        }

    }
})(jQuery);

如果我将它调用一次，功能会按预期工作，但如果我再次在第二个元素上调用它，它会中断。

$('#myelement').myplugin({'option1', 'option2'});
$('#myotherelement').myplugin({'option1', 'option2'});

不知何故，第二个实例中的间隔会覆盖前一个元素上的间隔，数据和所有元素。（但是传递的样式并没有搞砸。）这是setInterval的一个奇怪的限制，还是我做错了什么？

Answer 1

您必须使间隔句柄对每个元素都是私有的。为此，您可以使用$.data：

    this.each(function() {
        var interval = setInterval(function(){ doMyOtherFunc(options); }, 1000);
        $(this).data('myplugin-interval', interval);
    });

你可以用这种方式检索间隔：

$(this).data('myplugin-interval');

多次调用jQuery插件时SetInterval碰撞

1 个答案: