Javascript 自定义jQuery插件可能存在变量问题

创建我自己的jQuery插件来处理图像序列。当只有一个图像序列在运行时，一切都可以完美地工作。但是，当我在页面上同时有两个图像序列时（都是无限循环），两个图像序列中较小的图像序列会过早停止。它到达第二个循环，并始终在第34帧（38帧中的第34帧）处停止。我认为这可能是一个问题，第二个序列从第一个序列的变量中获取，但我不确定。在这之前一切都很好，所以我不确定。这是下面的代码，如果有太多需要接受的话，很抱歉

(function ( $ ) {

    $.fn.createSequence = function( sequence ) {
        var container = this;
        var dir = sequence.dir;
        var name = sequence.name;
        var extension = sequence.extension;
        var start = sequence.start;
        var end = sequence.end;
        var fps = 1000 / sequence.fps;
        var trailing = sequence.trailing || true;
        var digits = sequence.digits;
        var loopType = sequence.loopType || 'none';
        var loopAmount = sequence.loopAmount || 'infinite';
        this.currentLoop = 0;
        var zeroes = '';
        var reverse = false;

        // Prepare current frame using starting frame
        var currentFrame = start;

        // Function for adding trailing zeroes
        function calcTrailing(amount){
            zeroes = '';
            for ( i = 0; i < amount; i++ ) {
                zeroes = zeroes + '0';
            }
        }

        // Prepare zeroes variable based on number of digits
        if (trailing) {
            calcTrailing(digits);
        }

        // Build full source
        var fullSource = dir + name + zeroes + extension;

        // Append first frame to container
        container.append('<img src="' + fullSource + '" />');

        // Put added img element into variable for use
        var imgElement = container.children('img');

        // Change img src
        function changeSrc(frameNumber) {
            fullSource = dir + name + zeroes + frameNumber + extension;
            imgElement.attr('src', fullSource);
        }

        // Go to next frame
        function nextFrame() {
            if (reverse) {
                if (currentFrame == start) {
                    ++this.currentLoop;
                    reverse = false;
                    clearInterval(animation);
                    restartAnimation();
                } else {
                    --currentFrame;
                }
            } else {
                ++currentFrame;
            }
            if ( currentFrame > end ) {
                if ( loopType == 'none' ) {
                    clearInterval(animation);
                } else if ( loopType == 'restart' ) {
                    ++this.currentLoop;
                    if ( loopAmount == 'infinite' || this.currentLoop < loopAmount ) {
                        currentFrame = start;
                    }
                } else if ( loopType == 'reverse' ) {
                    reverse = true;
                    --currentFrame;
                }
            } else if ( currentFrame < 10 ) {
                calcTrailing(digits - 1);
                changeSrc(currentFrame);
            } else if ( currentFrame < 100 ) {
                calcTrailing(digits - 2);
                changeSrc(currentFrame);
            }
        }

        // Start the image sequence
        function animateSequence() {
            animation = setInterval(nextFrame, fps);
        }

        // Restart animation
        function restartAnimation() {
            if ( loopAmount == 'infinite' || this.currentLoop < loopAmount ) {
                animation = setInterval(nextFrame, fps);
            }
        }

        animateSequence();
    }
}( jQuery ));

（函数（$）{
$.fn.createSequence=函数（序列）{
var容器=这个；
var dir=sequence.dir；
var name=sequence.name；
var扩展=sequence.extension；
var start=sequence.start；
var end=sequence.end；
var fps=1000/sequence.fps；
var training=sequence.training | | true；
变量数字=序列数字；
var loopType=sequence.loopType | |“无”；
var loopAmount=sequence.loopAmount | |“无限”；
此.currentLoop=0；
var零=“”；
var反向=假；
//使用起始帧准备当前帧
var currentFrame=开始；
//用于添加尾随零的函数
功能计算跟踪（金额）{
零=''；
对于（i=0；i结束）{
如果（loopType=='none'）{
clearInterval（动画）；
}else if（loopType=='restart'）{
++这个.currentLoop；
if（loopAmount=='infinite'| | this.currentLoop

您是否尝试使用

返回此值。每个（函数（）{…}

要包装函数的内容吗？我早些时候尝试过，它使所有内容完全停止工作。我将在一分钟后重试。找出它导致函数不工作的原因，我的

容器

变量被定义为

this

，而不是

$（this）

在each函数中不起作用。但是，在

中包装所有内容将返回此值。each（函数（）{…}

导致与我最初遇到的问题相同。动画1按预期无限循环，但动画2到达第二个循环并在第34/38帧停止。如果有帮助，我会减慢动画的速度并逐帧观看以解决问题。动画1从第0帧到第60帧，然后按照预期返回到0。当它被激活时返回0，动画2位于第34帧并停止（因为动画1已到达其开始位置）。目前不确定此问题的修复方法。好的，我将“重新启动动画设置间隔”的名称更改为animation2，这样就解决了我的问题。现在的问题是动画的速度呈指数级增长。在不调用其他动画的情况下，启动和停止设置间隔的好方法是什么？