Question

我有一个jQuery UI对话框：

$("#dialog").dialog({
    modal: true,
    closeOnEscape: false,
    resizable: false,
    autoOpen: false,
    open: function() {
        $(".ui-dialog-titlebar").hide();
    }
});

我试图在AJAX调用之前打开这个对话框。它可以使用Firefox，但是在IE打开对话框之后，它不会打开，除非我放了一个alert。任何人都可以告诉我问题可能是什么？我使用以下代码：

$("button").click(function() {
    $("#dialog").dialog('open');
    //alert('test'); //if I put this alert, the dialog will open
    $.ajax({
        type: "POST",
        url: "testing.txt",
        async: false,
        dataType: "text",
        success: function(returnText) {
            $("#dialog").dialog('close');
            $("#textarea").text(returnText);
        },
        error: function() {
            $("#dialog").dialog('close');
        }
    });
});

Answer 1

由于潜在的动画，open事件异步完成，因此可能发生的是由于IE的JavaScript解释速度缓慢，关闭success或error对话框的代码回调（也是异步的）正在执行足够接近open的情况，你没有注意到对话框被打开。我猜你的AJAX调用很快就会完成。

解决这个问题的一种方法是将你的AJAX调用放在setTimeout块中。

$("button").click(function() {
    $("#dialog").dialog('open');

    setTimeout(function() {
        $.ajax({
            type: "POST",
            url: "testing.txt",
            async: false,
            dataType: "text",
            success: function(returnText) {
                $("#dialog").dialog('close');
                $("#textarea").text(returnText);
            },
            error: function() {
                $("#dialog").dialog('close');
            }
        });
    }, 1);
});

这只会将$.ajax调用排队，这将允许open事件完成。 John Resig很好地写了为什么这类事情在这里起作用 - http://ejohn.org/blog/how-javascript-timers-work/。

Answer 2

解决此问题的另一种方法是将“dialog.open”部分放在mousedown事件中而不是单击。这样你仍然可以做IE（8）在将它放入setTimeout时不喜欢的东西，比如下载文件。

jQuery UI对话框无法在Internet Explorer中打开

2 个答案: