尝试创建顺序的on.click事件

Question

我创建了一个初始点击事件，该事件产生了图片的一部分。 一旦运行，我试图创建另一个on click事件，它将继续产生图片的一部分。 一旦首次点击事件运行，我创建的第二个事件就不会运行。 我是否需要其他“ if”语句？ 这是到目前为止，我在单击事件中每个都有三个框架：

$(function() {
    var frames = $('#animation').children();
    var frameCount = frames.length;

    function startAnimation() { 
        var i = 0;
        var animationInterval = setInterval(function () { 
        if(i > frameCount - 1) {
            clearInterval(animationInterval);
        } else {
            frames[i % frameCount].style.display = "none";
            frames[i++].style.display = "inline";
        }
        },1000); 
    }

    $(frames[0]).on('click', startAnimation);


    var frames1 = $('#animation1').children();
    var frameCount1 = frames1.length;


    function continueAnimation() { 
        var i = 0;
        var animationInterval1 = setInterval(function () { 
        if(i < frameCount - 1) {
            clearInterval(animationInterval1);
        } else {
            frames1[i % frameCount1].style.display = "block";
            frames1[i++].style.display = "inline";
        }  
        },1000); 
    }

    $(frames[3]).on('click', continueAnimation);
});

Answer 1

您需要使用JQuery的委托功能（ http://api.jquery.com/delegate/ ）。 目前很难为您提供任何代码-正如Ergec所说，JS Fiddle示例非常棒。 您的问题主要源于.on（）的工作方式，它只注册在加载DOM时触发的触发器，而不是随后对DOM进行更改的触发器，这就是.delegate（'event'，'target'，function（event）{ }）; 派上用场，因为它允许您以编程方式附加事件，即使随后进行DOM更改也是如此。

Answer 2

这是我所做的修复，请查看

...

jsfiddle