Javascript ExtJs希望在Ext.onReady（）函数之后调用一些代码

在ExtJs中，我们有一个名为

Ext.onReady（）

的页面加载事件，它在

window.onload

之后调用，因为它注册到onload，然后被调用。所以我们能找到的最后一个事件基本上是

Ext.onReady（）

问题是我有几个

Ext.onReady（）

用于我们无法更改的业务需求。我有一个ExtJs选项卡面板，它被重新定向到页面的最后一个

Ext.onReady（）

中的页面

---

我想要的是在TabbedPanel呈现到页面后在其上注册一些事件。假设您无法控制选项卡面板的渲染事件，也无法在页面的最后一个

onReady

之后创建

onReady

谢谢你对朋友们的回复。我已经解决了这个问题。。为您的信息和您的信息，我发布解决方案

我已经用java创建了一个回调方法。这意味着它将从调用其他函数的特定位置调用。我刚刚检查了花费大量时间的函数，最后该函数创建了回调

问题解决了，谢谢……）

Ext.require([
“Ext.window.MessageBox”，
“外部提示。*”
]);
Ext.onReady（函数（）{
Ext.get（'mb1'）。on（'click'，函数（e）{
Ext.MessageBox.confirm（'confirm'，'you sure you think？'，showResult）；
});
Ext.get（'mb2'）。on（'click'，函数（e）{
提示（'Name'，'请输入您的姓名：'，showResultText）；
});
Ext.get（'mb3'）。on（'click'，函数（e）{
Ext.MessageBox.show({
标题：“地址”，
msg:'请输入您的地址：'，
宽度：300，
按钮：Ext.MessageBox.ok取消，
多行：对，
fn:showResultText，
动画获得：“mb3”
});
});
Ext.get（'mb4'）。on（'click'，函数（e）{
Ext.MessageBox.show({
标题：“保存更改”，
msg:“您正在关闭一个有未保存更改的选项卡。
是否保存更改？”，
按钮：Ext.MessageBox.yes取消，
fn:showResult，
animateTarget:'mb4'，
图标：Ext.MessageBox.QUESTION
});
});
Ext.get（'mb6'）。在（'click'，function（）上{
Ext.MessageBox.show({
标题：“请稍候”，
msg:'正在加载项目…'，
progressText:“正在初始化…”，
宽度：300，
进步：没错，
可关闭：错误，
动画获得：“mb6”
});
//这一可怕的障碍造成了虚假的进展
var f=函数（v）{
返回函数（）{
如果（v==12）{
Ext.MessageBox.hide（）；
msg（'Done'，'Your fake items loaded！'）；
}否则{
var i=v/11；
Ext.MessageBox.updateProgress（i，数学四舍五入（100*i）+'%completed'）；
}
};
};
对于（变量i=1；i<13；i++）{
设置超时（f（i），i*500）；
}
});
Ext.get（'mb7'）。在（'click'，function（）上{
Ext.MessageBox.show({
msg:'正在保存数据，请稍候…'，
progressText:“正在保存…”，
宽度：300，
等等：是的，
waitConfig:{interval:200}，
图标：'ext-mb-download'，//msg-box.html中的自定义类
动画获得：“mb7”
});
setTimeout（函数（）{
//这模拟了长时间运行的操作，如数据库保存或XHR调用。
//在实际代码中，这将出现在回调函数中。
Ext.MessageBox.hide（）；
msg（'Done'，'您的假数据已保存！'）；
}, 8000);
});
Ext.get（'mb8'）。在（'click'，function（）上{
Ext.MessageBox.alert（'Status'，'Changes saved successfully'，showResult）；
});
//动态添加这些值，这样它们就不会在html中硬编码
Ext.fly（'info'）.dom.value=Ext.MessageBox.info；
Ext.fly（'question'）.dom.value=Ext.MessageBox.question；
Ext.fly（'warning'）.dom.value=Ext.MessageBox.warning；
Ext.fly（'error'）.dom.value=Ext.MessageBox.error；
Ext.get（'mb9'）。在（'click'，function（）上{
Ext.MessageBox.show({
标题：“图标支持”，
msg:'这是一条带有图标的消息！'，
按钮：Ext.MessageBox.OK，
AnimateTaGet:'mb9'，
fn:showResult，
图标：Ext.get（'icons'）.dom.value
});
});
函数显示结果（btn）{
msg（'Button Click'，'您单击了{0}按钮'，btn）；
};
函数showResultText（btn，文本）{
msg（'Button Click'，'您单击了{0}按钮并输入了文本“{1}.”，btn，text）；
};
});

如果您想将事件添加到

选项卡面板

我假设您可以获得此面板的引用。因此，您可以检查面板是否已呈现：

if（tabbedPanel.rendered）{doSth（）；}else{tabbedPanel.on（'afterrender'，doSth）；}

我曾考虑将您的选项作为第一优先级，但在我的情况下，选项卡式面板本身在Ext.onReady（）上呈现！！而且我没有控制权在标签面板代码之后写任何东西。！似乎开始了，但它是。。。。（如果你知道savvion！！）。你可以随时延迟创建

onReady

，或者每隔一段时间检查选项卡式面板。我没有看到任何更好的解决方案，因为没有其他方法可以确保渲染所有内容。使用延迟效果效果效果非常好，所以我无法使用它。我最后有了这个解决方案。

Ext.require([
'Ext.window.MessageBox',
'Ext.tip.*'
 ]);

Ext.onReady(function(){
Ext.get('mb1').on('click', function(e){
    Ext.MessageBox.confirm('Confirm', 'Are you sure you want to do that?', showResult);
});

Ext.get('mb2').on('click', function(e){
    Ext.MessageBox.prompt('Name', 'Please enter your name:', showResultText);
});

Ext.get('mb3').on('click', function(e){
    Ext.MessageBox.show({
       title: 'Address',
       msg: 'Please enter your address:',
       width:300,
       buttons: Ext.MessageBox.OKCANCEL,
       multiline: true,
       fn: showResultText,
       animateTarget: 'mb3'
   });
});

Ext.get('mb4').on('click', function(e){
    Ext.MessageBox.show({
       title:'Save Changes?',
       msg: 'You are closing a tab that has unsaved changes. <br />Would you like to save your changes?',
       buttons: Ext.MessageBox.YESNOCANCEL,
       fn: showResult,
       animateTarget: 'mb4',
       icon: Ext.MessageBox.QUESTION
   });
});

Ext.get('mb6').on('click', function(){
    Ext.MessageBox.show({
       title: 'Please wait',
       msg: 'Loading items...',
       progressText: 'Initializing...',
       width:300,
       progress:true,
       closable:false,
       animateTarget: 'mb6'
   });

   // this hideous block creates the bogus progress
   var f = function(v){
        return function(){
            if(v == 12){
                Ext.MessageBox.hide();
                Ext.example.msg('Done', 'Your fake items were loaded!');
            }else{
                var i = v/11;
                Ext.MessageBox.updateProgress(i, Math.round(100*i)+'% completed');
            }
       };
   };
   for(var i = 1; i < 13; i++){
       setTimeout(f(i), i*500);
   }
});

Ext.get('mb7').on('click', function(){
    Ext.MessageBox.show({
       msg: 'Saving your data, please wait...',
       progressText: 'Saving...',
       width:300,
       wait:true,
       waitConfig: {interval:200},
       icon:'ext-mb-download', //custom class in msg-box.html
       animateTarget: 'mb7'
   });
    setTimeout(function(){
        //This simulates a long-running operation like a database save or XHR call.
        //In real code, this would be in a callback function.
        Ext.MessageBox.hide();
        Ext.example.msg('Done', 'Your fake data was saved!');
    }, 8000);
});

Ext.get('mb8').on('click', function(){
    Ext.MessageBox.alert('Status', 'Changes saved successfully.', showResult);
});

//Add these values dynamically so they aren't hard-coded in the html
Ext.fly('info').dom.value = Ext.MessageBox.INFO;
Ext.fly('question').dom.value = Ext.MessageBox.QUESTION;
Ext.fly('warning').dom.value = Ext.MessageBox.WARNING;
Ext.fly('error').dom.value = Ext.MessageBox.ERROR;

Ext.get('mb9').on('click', function(){
    Ext.MessageBox.show({
       title: 'Icon Support',
       msg: 'Here is a message with an icon!',
       buttons: Ext.MessageBox.OK,
       animateTarget: 'mb9',
       fn: showResult,
       icon: Ext.get('icons').dom.value
   });
});

function showResult(btn){
    Ext.example.msg('Button Click', 'You clicked the {0} button', btn);
};

function showResultText(btn, text){
    Ext.example.msg('Button Click', 'You clicked the {0} button and entered the text "{1}".', btn, text);
};
});