javascript - 如何从 'one' 事件获取回调

Question

我正在构建一个 JavaScript 应用程序，有时需要进行触发单击。调用触发器，应用程序等待一次动画结束，然后运行几行代码。但脚本不会等到动画结束并继续执行其他代码。

问题很难描述，所以这是我的代码:

var $output = $('#output');

$('#link-1').click(function(){
    $('#link-2').trigger('click');
    $output.append('<div>Second output</div>');
});

$('#link-2').click(function(){
    var $obj = $(this);
    $obj.toggleClass('active');

    $obj.one('transitionend', function(){
        $output.append('<div>First output</div>');
    });
});

结果如下:

<div id="output">
    <div>Second output</div>
    <div>First output</div>
</div>

您可以在这里尝试:http://jsfiddle.net/MKZvZ/1/

如何实现第一个输出出现在第二个输出之前？

第一个输出和第二个输出只是基本示例，实际上应用程序执行了一些逻辑工作。

Answer 1

您可以使用setTimeout函数来延迟进程

window.setTimeout(function() {
        // this will execute 1 second later
    }, 1000);

请引用以下链接。在这里他们可以解释如何延迟执行。您可以延迟执行，直到动画结束。

http://stackoverflow.com/questions/4912655/javascript-how-to-put-a-simple-delay-in-between-execution-of-javascript-code