Question

在我的模态JQuery对话框中单击按钮后，我想更新对话框中的html以显示文本和指示工作正在进行的图像（微调器等）。当我在下面的示例中执行时，html不会更新。就好像代码永远不会执行，或执行得太晚，因此更改不可见。但是，如果我取消注释警报（'嘿'）;代码，确实如此。有什么好方法可以实现我的目标？

$dialog.dialog( "option", "title", 'Do lengthy work' );
$dialog.dialog( "option", "buttons", {

    "Cancel": function() { $(this).dialog("close"); },
    "Start Work": function() {

        $(this).html('Working...<p/><img src="http://mydomain.com/progress.gif"');
        //alert('hey');
        doLengthyWorkFunction();
        $(this).dialog('close');
    }
} );
$dialog.html('Click the Start Work button to begin.');
$dialog.dialog('open');

Answer 1

setTimeout()来电将释放系统以更新显示屏：

$dialog.dialog( "option", "buttons", {

    "Cancel": function() { $(this).dialog("close"); },
    "Start Work": function() {

        $(this).html('Working...<p/><img src="http://mydomain.com/progress.gif"');
        setTimeout( function() {
            doLengthyWorkFunction();
            $(this).dialog('close');
            },
            0
        );
    }
} );

Answer 2

我不确定你的doLengthyWorkFunction是做什么的，但如果它正在发出ajax请求，那么工作就是异步完成的，因此实际调用$.get或$.post或者无论什么几乎是瞬间结束。

如果是这种情况，那么您希望在ajax成功函数中使用对话框关闭代码而不是对话框按钮单击事件。

JQuery模式对话框HTML不更新

2 个答案: