当设置为不久后显示 DOM 操作功能时，Javascript 忙覆盖不显示

Question

我有一个很大的数据表( https://datatables.net/ )，我需要在单击按钮后重新创建它。此重新创建需要几秒钟，因此我想在完成此操作时显示“繁忙覆盖”。

问题是 DOM 在(重新)处理表时卡住之前不会更新(即覆盖层未显示)。完成后，它会短暂显示并消失。

function addColumn(filterToggle, propertyName, table) {
    $('#ResultsTable').closest('.card').find('.overlay').fadeIn();    
    table.destroy();
    //do stuff    
    table = getProjectsTable();
    //do more stuff
    $(overlay).fadeOut();
}

我想我需要稍等一下，以便在继续执行之前覆盖层实际上可见 - 但如何呢？

关于“javascript 'sleep()'方法的大多数问题大多数时候都说它是一个 hacky hacky...

Answer 1

好吧，感谢 Petr 的评论，我已经使用 setTimeout() 解决了这个问题。

郑重声明，工作代码:

    function addColumn(filterToggle, propertyName, table) {
        $('#ResultsTable').closest('.card').find('.overlay').fadeIn();    

        setTimeout(function(){
             table.destroy();
             //do complex stuff here
             table = getProjectsTable();
             //do more stuff
        },10);

        $(overlay).fadeOut();
    }