Question

我创建了一个初始点击事件，可以生成图片的一部分。一旦运行，我试图创建另一个点击事件，将继续生成图片的一部分。一旦初始点击事件运行，我创建的第二个事件就不会。我需要额外的＆＃34; if＆＃34;声明？这是我到目前为止所拥有的内容，每个点击事件都有三个框架：

$(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

尝试创建顺序on.click事件

2 个答案: