Easy UI 遮罩(MASK)-阿里云开发者社区

开发者社区> 开发与运维> 正文
登录阅读全文

Easy UI 遮罩(MASK)

简介:

Easy UI 的各类控件有些带了遮罩功能,如 DataGrid,可以这样使用:

//显示遮罩

$("#dg").datagrid("loading", "数据加载中……");

//隐藏遮罩

$("#dg").datagrid("loaded");

在有些情况下,我们不能直接使用控件本身的遮罩效果,比如:

1:有些控件则没有这样的属性,比如 Tabs;

2:页面初始加载时;

3:通过 Ajax 异步获取数据并刷新当前页面;

这个时候,就要采用另外的办法来进行遮罩。有一个方案是,使用:

//开启遮罩

$.messager.progress({ 
    title: 'Please waiting', 
    msg: 'Loading data...', 
    text: 'PROCESSING.......' 
});

//关闭遮罩

$.messager.progress('close');

效果如下:

image

注意,三个属性不是必选的。属性 title 和 msg 如果不设置,则画面中 1 和 2 不显示,属性 text 不设置,则 3 处显示的一个自动变化的百分比。

以下是一个示例:

var step1Ok = function () { 
    $.messager.progress({ 
        title: 'Please waiting', 
        msg: 'Loading data...', 
        text: 'PROCESSING.......' 
    });

    $.ajax({ 
        type: "GET", 
        url: "@ViewBag.Domain/Paper/GetQuestionUnit",

        success: function (data) { 
            $.messager.progress('close'); 
            alert(data); 
        } 
    }); 
};

本文转自最课程陆敏技博客园博客,原文链接:http://www.cnblogs.com/luminji/p/3291195.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章
最新文章
相关文章