JavaScript的confirm防止屏幕更新的Chrome

Question

我有一个JavaScript函数做两件事情：

• 更改表行的背景颜色
• 问题的确认（）弹出要求用户确认删除的（突出显示）row

它在Firefox上正常工作。在Chrome上，弹出窗口出现。但是在后面的背景不会改变颜色，直到我放弃confirm（）方块，这种方式会让用户知道要删除哪一行。

我相信它与JavaScript的异步性质有关。但我需要知道如何解决它。眼下，中两行代码是：

$(icon).closest("tr").css("background-color", "yellow"); 
    if (confirm(message)) {.......} 

什么我需要做，以确保在显示弹出行是黄色的，不等待变为黄色，直到弹出消失之后？我可以尝试延迟等，但这是抓住吸管。有没有一种“正确”的方式来处理这个问题？

再次，在Chrome浏览器上工作正常.... nada。还没有尝试过其他浏览器。

谢谢。 Jerry

Answer 1

我可以尝试延迟等，但这是抓住吸管。

不是。

这完全取决于浏览器何时渲染东西。每个浏览器引擎都有自己的优化。处理这个问题的唯一方法是短暂的延迟。

一种可靠的延迟形式是requestAnimationFrame()。我认为你可以合理地确信，一旦这个问题被解决，浏览器就会重绘以前的任何东西。未经测试，但请尝试如下所示：

$(icon).closest('tr').css('background-color', 'yellow'); 
requestAnimationFrame(function() { 
    if (confirm(message)) { 

    } 
}); 

另请注意，您无法控制确认框出现的位置。它可能在你的内容之上。由浏览器决定如何呈现，无论是传统的工具式窗口还是全屏模式。