Question

我正在使用jQuery Alert Dialogs Plugin（http://abeautifulsite.net/，版本1.1）和jQuery v1.6.1。在IE 11和Chrome 41.0.x版本上测试过。有一个测试代码：

    var t = (new Date()).getTime();
    jAlert('Test message');
    console.log('Alert displayed, d=' + ((new Date()).getTime() - t));
    console.log('  Alert visible: ' + $('#popup_panel').is(":visible") + ', Overlay visible: ' + $('#popup_overlay').is(":visible") + ', d=' + ((new Date()).getTime() - t));

    $.ajax({
        url: 'http://ip.jsontest.com/',
        data: { },
        type: 'GET',
        async: false,
        complete: function() {
            console.log('Ajax complete, d=' + ((new Date()).getTime() - t));
            $.alerts._hide();
            console.log('  Alert visible: ' + $('#popup_panel').is(":visible") + ', Overlay visible: ' + $('#popup_overlay').is(":visible") + ', d=' + ((new Date()).getTime() - t));
        }
    });

控制台输出：

Alert displayed, d=8
  Alert visible: true, Overlay visible: true, d=9
Ajax complete, d=276
  Alert visible: false, Overlay visible: false, d=281

我的问题是，当我将$ .ajax async设置为false时，不会显示警告框。当async设置为true时，一切正常。我知道什么是异步：假意味着。我在表单中用它来提交数据。当数据提交正在进行中时，我想显示和警告框，例如“正在进行操作...”并阻止任何用户输入（鼠标单击，键盘输入键等）。在我的应用程序的某些地方，这在其他地方不起作用，我无法弄清楚为什么。有没有办法确保在实际的ajax调用之前进行UI更改？

Answer 1

来自bugs.jquery.com：

如果我显示一条消息（说...＆＃34;正在加载＆＃34;）在进行AJAX通话之前，我就是这样做的   期待它显示。

通话前的代码正在运行，但这并不代表您的意愿   立即看到结果。如果电话真实而完整   同步，窗口更新可能不会发生在$ .ajax之后   通话完成。它不会有任何不同：

如果您真的想要使用async:false ajax，那么您可以尝试使用setTimeOut对其进行扭曲，让浏览器在它之前执行代码并在浏览器冻结之前查看更改。

var t = (new Date()).getTime();
    jAlert('Test message');
    console.log('Alert displayed, d=' + ((new Date()).getTime() - t));
    console.log('  Alert visible: ' + $('#popup_panel').is(":visible") + ', Overlay visible: ' + $('#popup_overlay').is(":visible") + ', d=' + ((new Date()).getTime() - t));

// do async call
setTimeout(function () {
   $.ajax({
        url: 'http://ip.jsontest.com/',
        data: { },
        type: 'GET',
        async: false,
        complete: function() {
            console.log('Ajax complete, d=' + ((new Date()).getTime() - t));
            $.alerts._hide();
            console.log('  Alert visible: ' + $('#popup_panel').is(":visible") + ', Overlay visible: ' + $('#popup_overlay').is(":visible") + ', d=' + ((new Date()).getTime() - t));
        }
    });
}, 20);

jAlert没有出现jQuery ajax同步

1 个答案: