ExtJS的MessageBox不像alert(..)那样会阻塞程序。

Question

ExtJS的MessageBox不像alert(..)那样会阻塞程序。

3

ExtJS MessageBox似乎不像Javascript的alert(..)一样阻塞。我想显示一个弹出窗口，然后调用AJAX调用，之后它将关闭窗口。

如果我像这样调用show方法...

//Alert Box :
var alertBox = Ext.create('Ext.window.MessageBox');
var config = {
    title : 'Title',
    closable: true,
    msg: 'Message',
    buttons: Ext.Msg.OK,
    buttonText: { ok: EML.lang.buttons.ok },
    modal: true
};
alertBox.show(config);


//callback
Ext.Ajax.request({
    url: someURL,
    method: 'POST',
    callback: function (options, success, response) {
        //do some stuff
        self.up('window').destroy();
    }
})

没有弹出窗口，但是父窗口被关闭了。

如果使用标准的Javascript alert，那么弹出框会阻塞。在点击“确定”按钮之后，回调函数会执行，然后窗口关闭。

    //Alert Box :
    alert('asdf')


    //callback
    Ext.Ajax.request({
        url: someURL,
        method: 'POST',
        callback: function (options, success, response) {
            //do some stuff
            self.up('window').destroy();
        }
    })

为什么弹出框不会阻塞程序？
我该怎么解决这个问题？
弹出框是否需要知道父窗口才能阻塞程序？

- Oliver Watkins

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Alexander · Accepted Answer

由于自定义JavaScript代码不支持块，因此它不会被阻止。正如Chrome控制台所告诉我们的那样，

window.alert
function alert() { [native code] }

本地代码可以阻止执行。

在 ExtJS 中，您可以像这样编写消息框的回调函数：

//Alert Box :
var alertBox = Ext.create('Ext.window.MessageBox');
var config = {
    title : 'Title',
    closable: true,
    msg: 'Message',
    buttons: Ext.Msg.OK,
    buttonText: { ok: EML.lang.buttons.ok },
    modal: true,
    callback:function(btn) {
        //callback
        Ext.Ajax.request({
            url: someURL,
            method: 'POST',
            callback: function (options, success, response) {
                //do some stuff
                self.up('window').destroy();
            }
        })
    }
};
alertBox.show(config);

如果这样的回调嵌套非常深，我倾向于像这样展开回调：

var store = me.down('grid').getStore();
var callback3 = function(btn) {
    if(btn=="yes") store.sync();
};
var callback2 = function() {
    Ext.Msg.prompt('A','Third', callback3);
};
var callback1 = function() {
    Ext.Msg.alert('A','Second', callback2);
};
Ext.Msg.alert('A','First', callback1);

在较新的ExtJS版本中，你可以查看Ext.Promise，但在ExtJS 4.1中不可用。