Question

我有一个按钮可以执行一些繁重的计算，并且在计算步骤之间我要刷新页面。

JavaScript的：

.on('click', function() {
    // compute something

    jQuery('#page')
        .trigger('pageshow')
    ;

    // compute something

    jQuery('#page')
        .trigger('pageshow')
    ;

    // compute something
}

这很遗憾，因为在pageshow完成后会触发.on(click) - 事件。

有没有办法强制立即执行.trigger(...)？

JavaScript - 丑陋的解决方案：

.on('click', function() {
    // compute something

    window.setTimeout(function() {
        // compute something

        jQuery('#page')
            .trigger('pageshow')
        ;

        window.setTimeout(function() {
            // compute something

            jQuery('#page')
                .trigger('pageshow')
            ;
        }, 1);
    }, 1);
}

丑陋的解决方案可行，但真的很难看。还必须检查.on('click', ...) - 事件在被触发时是否完全计算。

JavaScript - 更漂亮，但仍然难看的解决方案：

var functionFirst = function() {
    // compute something

    jQuery('#page')
        .trigger('pageshow')
    ;

    window.setTimeout(functionSecond, 1);
};

var functionSecond = function() {
    // compute something

    jQuery('#page')
        .trigger('pageshow')
    ;

    window.setTimeout(functionThird, 1);
};

var functionThird = function() {
    // compute something

    jQuery('#idJqGame')
        .trigger('pageshow')
    ;
};

window.setTimeout(functionFirst, 1);

更漂亮，但仍然难看的解决方案基本上与丑陋的解决方案相同 - 它更容易阅读，因此我到目前为止都是这个。

Answer 1

JavaScript解释器是围绕“事件循环”构建的。由于这种设计，并且解释器在单个线程中运行，所有事件都按顺序处理。

如果可以在您的应用程序设计中使用，请尝试定期调用页面刷新而不是事件。

如果您可以保证您的应用程序只能在现代浏览器上运行，那么另一种选择是将“繁重的计算”移动到Web工作者。更多信息：https://developer.mozilla.org/en/Using_web_workers

编辑1：

根据http://dev.opera.com/articles/view/timing-and-synchronization-in-javascript/的“嵌套事件”部分，如果您使用本机浏览器功能对事件进行排队，则可以实现您想要的功能

另一个优雅的解决方案可能是利用事件的顺序处理。将“繁重计算”移动到事件处理程序。然后选择推送'compute'和'pageshow'事件，以便它们可以被调用。这就是说，我担心这会导致页面看起来没有响应，因为常规DOM事件也会在之后排队。

编辑2：

刚刚发现：http://api.jquery.com/queue/可能有帮助。

Answer 2

我很遗憾地说丑陋的解决方案是最好的解决方案它可以被美化，但最重要的是你需要将代码分解成更小的块，以便有可能控制它们。

如何立即强制使用.trigger（...）？

2 个答案: