Javascript 为什么可以'；在功能开始时，我是否更改此按钮的文本？

我有一个钮扣。onClick按钮触发一个JS函数。在这个函数的第一行代码中，我使用jQuery更改按钮的HTML。然后该函数需要几秒钟的时间。按钮HTML仅在完成完整功能后更改（在浏览器中）

守则：

切换
功能设置为禁用（btn）{
//日志
console.log（'start'）；
//如何强制浏览器立即显示此文本？
$（btn）.html（“函数开始时文本已更改”）；
//创建2秒延迟
var d1=新日期（）；
var t1=d1.getTime（）；
var-keeprunning=true；
同时（继续修剪）{
var d2=新日期（）；
var t2=d2.getTime（）；
var-dif=t2-t1；
如果（（dif/1000）>2）keeprunning=false；
}
//日志
console.log（'done'）；
}

问题是因为

while（）

循环是同步的，在更新UI的浏览器线程有机会执行之前开始执行。因此，在循环完成之前，UI将被阻止更改，此时新的HTML将应用于按钮

要解决此问题，请使用超时来延迟某些逻辑。它是异步的，不会干扰UI：

$（'.btn'）。单击（函数（）{
console.log（'start'）；
$（this.html（“函数开始时文本已更改”）；
setTimeout（函数（）{
console.log（'done'）；
}, 2000);
});

切换
不要阻止UI线程。相反，使用
setTimeout
非常感谢的可能副本是有意义的。但是，在我的例子中，延迟是由一个同步AJAX请求引起的（我知道，这是一个糟糕的做法，甚至是不推荐的），在这个同步请求之前是否有可能更改按钮UI？@marcelwijk同样，只需在
setTimeout
中执行AJAX调用。（您可以将超时延迟设置为
0
），或者更好，不要使用同步AJAX请求。当您构造代码以使用回调时，实际上没有必要这样做。不过，很高兴这解决了你的问题。是的，我知道。但是我使用了一个插件（JQPlot），它需要AJAX数据渲染器的同步AJAX请求，所以我不得不使用它。但现在一切都正常了，再次感谢。如果是这样，我会找到另一个图表渲染插件。强制您使用
async:false
就是不使用该库的充分理由