javascript - 函数没有立即执行

<分区>

我有一个函数 showLoading()，它通过附加一个类来显示微调器:

function showLoading(){
    //console.log("show loading");
    loading = true;
    $("body").addClass("loading");
}

我这样调用它:

Function heavyCrunch(){
    showLoading();

    <heavy crunching>

    hideLoading();
}

现在，每当我在某个需要 > 1 秒的重负载之前调用该函数时，它应该立即显示微调器，但它没有。事实上，它根本不显示。每当我单击触发 heavyCrunch() 函数的按钮时，它只会卡住一两秒钟，然后立即显示结果。微调器永远不会显示。为什么会这样？

我应该在 .after 回调中调用该函数还是什么？

最佳答案

当您的代码正在执行时，DOM 不会刷新。它一直等到结束。

如果您希望更改可见，则必须推迟执行:

function heavyCrunch(){
    showLoading();
    setTimeout(function(){

        <heavy crunching>

        hideLoading();
    }, 0);
}

请注意，在某些处理繁重的情况下，您可能希望释放浏览器的压力，让它有时间真正进行绘制。在这种情况下，您可以使用大于 0 的超时。

关于javascript - 函数没有立即执行，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30627884/

相关文章：

javascript - AngularJS如何获取范围内变量的值