`
langgufu
  • 浏览: 2285843 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

ExtJs LoadMask相关的遮罩效果

EXT 
阅读更多
Ext.onReady(function() {

     var a = Ext.MessageBox.wait('content', 'title');  

    (function() {

      a.hide() 

  }).defer(3000); //隐藏延迟,可简化为 a.hide.defer(3000,a);

  var mask = new Ext.LoadMask(Ext.getBody(), {                         

msg : 'please waiting ... ',                          

removeMask : true

});

mask.show();//使用 mask 需手动调用show() 方法下                            

(function() {

mask.hide();

}).defer(4000);

}); 

---------------------------------------------

var t=0;  
function progress(){  
    t=0;  
    var msgbox=Ext.Msg.progress("请稍候","保存数据","正在保存数据, 请稍候。。。。。。");//显示等待对话框  
    updateProgress();  
}  
function updateProgress(){  //更新进度条  
    t+=0.2;  
    Ext.Msg.updateProgress(t);  
    if(t>1)  
        Ext.Msg.hide();  
    else 
        updateProgress.defer(700);  
}  
progress();

------------------------------------------------------

var mask = new Ext.LoadMask("ID", {
     msg : '正在加载...'
     });
     mask.show();
    borrowhistory_store.load({
                params : {
                    webname : "all",
                    start : 0,
                    limit : borrowhistory_pageTool.pageSize
                }
            });
     borrowhistory_store.on("load", function() {
     mask.hide();
     })




Ext.LoadMask用于在加载数据时为元素做出类似于遮罩的效果。可以直接应用在元素上,如:

var loadMarsk = new Ext.LoadMask(document.body//元素、DOM节点或id, {
     msg : '正在删除数据,请稍候。。。。。。',
     removeMask : true// 完成后移除
});
loadMarsk .show(); //显示

然后在处理完成的方法中loadMarsk .hide();

还可以和Ext.data.Store结合,可将效果与Store的加载达到同步,如:

var loadMarsk = new Ext.LoadMask(document.body, {
    msg : '数据处理中!',
    disabled : false,
    store : store
});

在form的submit方法中有waitMsg属性来达到上面的效果 ,如:

form.submit({
     waitMsg : '正在提交数据...'

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics