JQuery show（）仅在我的函数完成后才有效

Question

我正在尝试使用JQuery的show()来显示忙碌指示符，而我的函数（带有一些重数字运算）会运行。但是，指示器仅在功能完成时显示，或者在我取消注释功能结束时的hide()时根本不显示。

我正在使用display: none;来隐藏指标。

var convert = function() {
    $("#working").show();
    // ...
    $("#working").hide();
};

Answer 1

这是因为浏览器的工作方式类似于单线程应用程序，包括脚本执行和脚本执行。

即使您正在设置显示，实际渲染也不会发生，直到当前脚本执行完成。

一个简单的黑客就是使用一个小计时器来延迟大任务，并为渲染操作提供更新UI的机会

var convert = function() {
  $("#working").show();
  setTimeout(function() {
    // ...
    $("#working").hide();
  });
};