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,如需转载请自行联系原作者
相关文章
|
3月前
|
JSON 监控 数据格式
Easy UI datagrid的学习
Easy UI datagrid的学习
|
前端开发 JavaScript Java
关于Easy UI中文件上传处理进度条的实现
关于Easy UI中文件上传处理进度条的实现
296 0
easy UI简单使用介绍
http://www.cnblogs.com/yokoboy/archive/2012/12/06/2806132.html
720 0
|
JavaScript 前端开发 Go
JQuery Easy Ui (Tree树)详解(转)
 第一讲:JQuery Easy Ui到底是什么呢? 首先咱们知道JQuery是对Java Script的封装,是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。。 JQuery ui是在jQuery的基础上,利用jQuery的扩展性,设计的插件。
2087 0
|
Web App开发 JSON JavaScript
Jquery easy ui datagrid動態加載列問題
原文:Jquery easy ui datagrid動態加載列問題 1.如下图效果是当选择不同的日期范围时datagrid则会加载出对应的列数     2.首先是后台组装数据,我采用的是循环并拼接DataTable数据,如下代码          //循環添加datagrid所需的表頭數據 for (int i = 0; i < table.
1175 0
|
前端开发 JavaScript
|
JavaScript 前端开发 API
茗洋芳竹Easy UI 部分问题解决系列专题[datagrid 复杂表头]
原文 http://www.cnblogs.com/Fresh-Air/archive/2013/05/14/3077948.html 1. 合并 datagrid 的表头信息【基础】,茗洋芳竹尝试Easy API的例子的延伸 部分效果图: 部分代码: $('#dg').
995 0
|
2月前
|
前端开发 搜索推荐 开发者
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
32 0