为什么onComplete函数执行多次?

时间:2011-11-21 09:39:42

标签: jquery colorbox

以下是重现此问题的示例。

<script>
    $(document).ready(function(){
        var repeatedTimes = 0;
        $.colorbox({html:'hello1'});
        $.colorbox({html:'hello2'});
        $.colorbox({html:'hello3'});
        $.colorbox(
        {
            html:'hello4',
            onComplete: function() {
                alert("repeat " + repeatedTimes++ + " times.");
            }
        });
    });
</script>

为什么onComplete函数执行多次?

注意:此代码仅用于重现该问题。在真实场景中,在彩盒调用之间,会执行其他代码。

注意:在这种情况下,colorbox用于在通常长时间的进程之间显示消息。问题是这些过程是短暂的。

2 个答案:

答案 0 :(得分:0)

我不熟悉这个模块,但你应该尝试在特定元素上调用插件,而不仅仅是$。

尝试$('html')。colorbox,无论它是什么......

答案 1 :(得分:0)

正如Gummy指出的那样,你永远不需要以这种方式调用colorbox。只要您拥有$.colorbox(),就会立即打开颜色框(即使您设置了open:false选项)。虽然你没有看到前3个电话,因为下一个电话会立即控制可见部分,但它们仍会完整运行。这也意味着如果您定义了onLoadonOpenonCleanup回调,它们也会被调用4次。因为它发生得如此之快,所以在所有4次调用运行onComplete时,设置现在是最后一次调用中的任何内容。

但是,如果每个人在最后一个完成执行后执行,那么你就不会看到这种情况发生。例如:

$(document).ready(function() {
    var repeatedTimes = 0;

    $.colorbox({html:'hello1'});
    setTimeout(function(){
        $.colorbox({html:'hello2'});
    }, 1000);
    setTimeout(function(){
        $.colorbox({html:'hello3'});
    }, 2000);
    setTimeout(function(){
        $.colorbox({
            html:'hello4',
            onComplete: function() {
                alert("repeat " + repeatedTimes++ + " times.");
            }
        });
    }, 3000);
});

以您期望的方式工作 - 或者更确切地说,只调用onComplete一次。我想你可以把它当作某种横幅或类似的东西,但是有更好的方法可以做到这一点。