BlockUI需要很长时间才能阻止jQuery对话框

Question

我正在尝试使用jQuery BlockUI插件在执行排序算法时阻止jQuery对话框.排序的功能如下:

doSort : function() {
    $("#sort_dlg").block();

    // sort... takes a few seconds

    $("#sort_dlg").unblock();
}

它有效,有点.在排序完成之后,对话框才会被阻止.(排序全部在本地完成,没有AJAX调用或任何东西.)如何在排序之前阻止它？

我尝试将block()调用移动到对话框的OK按钮方法:

$(function() {
    $("#sort_dlg").dialog({
        autoOpen: false,
        bgiframe: true,
        modal: true,
        buttons: {
            "Cancel": function() { $(this).dialog("close"); },
            "OK": function() {
                $("#sort_dlg").block();
                doSort();
            }
        }
    });
});

但这没有帮助.(我愿意接受使用其他技术阻止UI的建议.)

Answer 1

正如@Pandincus指出的那样,你可以等一段时间让blockUI完成它的工作,然后开始排序:

$(function() {
    $("#sort_dlg").dialog({
        autoOpen: false,
        bgiframe: true,
        modal: true,
        buttons: {
            "Cancel": function() { $(this).dialog("close"); },
            "OK": function() {
                $("#sort_dlg").block();
                //WAIT FOR 1 SECOND BEFORE STARTING SORTING
                setTimeout(function(){ doSort()}, 1000);
            }
        }
    });
});

Answer 2

$ .blockUI有一个名为"fadeIn"的选项,默认为200毫秒.您可以将此值设置为零,以便在调用方法时立即发生页面阻止.这会禁用fadeIn.

$(function() {
$("#sort_dlg").dialog({
    autoOpen: false,
    bgiframe: true,
    modal: true,
    buttons: {
        "Cancel": function() { $(this).dialog("close"); },
        "OK": function() {
            $("#sort_dlg").block({ fadeIn: 0 }); // disable fadeIn
            doSort();
        }
    }
});