extjs touch ajax 交互，遮罩，提示

最新推荐文章于 2016-03-18 09:32:57 发布

原创最新推荐文章于 2016-03-18 09:32:57 发布 · 置顶 · 728 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#extjs touch ajax 交互 #遮罩 #提示

提示同时被 3 个专栏收录

1 篇文章

订阅专栏

遮罩

1 篇文章

订阅专栏

extjs touch ajax 交互

1 篇文章

订阅专栏

本文介绍了一种在ExtJS框架中优化加载遮罩的方法，通过覆盖Ext.data.Connection请求处理方式，实现页面加载时显示遮罩，并在加载完成后移除遮罩的效果。此方法能够提升用户体验，适用于需要频繁与后台交互的应用场景。

tiger_request_num = 0;

Ext.override(Ext.data.Connection, {
    request: Ext.Function.createSequence(Ext.data.Connection.prototype.request, function () {
        if (tiger_request_num == 0) {

            Ext.Viewport.add({xtype:'loadmask', 
                message:'正在努力与后台交互...', 
                id:'tigerleq-panel-mask'  //赋给它id  
            }); 

        }
        tiger_request_num++;
    }),
    onUploadComplete: Ext.Function.createSequence(Ext.data.Connection.prototype.onUploadComplete, function () {

        tiger_request_num--;
        if (tiger_request_num == 0) {
            Ext.Viewport.remove(Ext.getCmp('panel-mask'));
        }
    }),
    onComplete: Ext.Function.createSequence(Ext.data.Connection.prototype.onComplete, function () {

        tiger_request_num--;
        if (tiger_request_num == 0) {
            Ext.Viewport.remove(Ext.getCmp('tigerleq-panel-mask'));
        }
    })
});