文档章节

jQuery扩展easyui.datagrid,添加数据loading遮罩效果代码

深圳大道
 深圳大道
发布于 2016/12/29 15:39
字数 153
阅读 63
收藏 0
//jquery.datagrid 扩展加载数据Loading效果
        (function (){
            $.extend($.fn.datagrid.methods, {
                //显示遮罩
                loading: function(jq){
                    return jq.each(function(){
                        $(this).datagrid("getPager").pagination("loading");
                        var opts = $(this).datagrid("options");
                        var wrap = $.data(this,"datagrid").panel;
                        if(opts.loadMsg)
                        {
                            $("<div class=\"datagrid-mask\"></div>").css({display:"block",width:wrap.width(),height:wrap.height()}).appendTo(wrap);
                            $("<div class=\"datagrid-mask-msg\"></div>").html(opts.loadMsg).appendTo(wrap).css({display:"block",left:(wrap.width()-$("div.datagrid-mask-msg",wrap).outerWidth())/2,top:(wrap.height()-$("div.datagrid-mask-msg",wrap).outerHeight())/2});
                        }
                    });
                },
                //隐藏遮罩
                loaded: function(jq){
                    return jq.each(function(){
                        $(this).datagrid("getPager").pagination("loaded");
                        var wrap = $.data(this,"datagrid").panel;
                        wrap.find("div.datagrid-mask-msg").remove();
                        wrap.find("div.datagrid-mask").remove();
                    });
                }
            });
        })(jQuery);



        //使用方法:
        $("#dataGrid").datagrid("loadData",(function (){
            $("#dataGrid").datagrid("loading");
            return []; //[]需要加载的数据
        })());


        //在datagrid的事件onLoadSuccess中添加
        onLoadSuccess:function (){
            $("#dataGrid").datagrid("loaded");
        }

本文转载自:http://blog.csdn.net/smartsmile2012/article/details/53284157

深圳大道
粉丝 3
博文 877
码字总数 0
作品 0
深圳
架构师
私信 提问
easyui为tab添加遮罩层

项目里要用HighChart显示图表,如果返回的数量量太多,生成图表是一个很耗时的过程。tab控件又没有显示遮罩的设置(至少本菜是没有找到), Google了一下,根据另一个兄台写的方法,拿来改造...

文文1
2015/08/03
0
0
鼠标移入移出效果 -- jQuery/Vue版

元素内遮罩层根据鼠标方向显示的效果比较常见,比如百度图片里的图片信息展示。自己动手实现jQuery插件版和Vue组件版效果。 原文链接 实现思路 1、根据鼠标的位置定位在元素内出现的方向 2、...

bestvist
2018/06/22
0
0
jQuery实现带遮罩层的消息框滑入滑出效果

首先,使用一个遮罩层来遮住整个页面,在遮罩层上显示一个消息框,消息框还可以被关闭,最后使用jQuery使得消息框从页面顶部滑下,实现的效果如下: 遮罩层的样式如下: 样式说明了不论在哪种...

罗盛力
2012/02/17
0
1
bDialog v2.0 发布,增加消息对话框、遮罩等新功能

下拉分页选择插件 bDialog v2.0 发布了,插件更新内容: 修复窗口最大化后,内部iframe高度没有最大化的问题 重构代码结构 增加窗口打开后的动画效果 增加国际化多语言支持 增加bDialog.ale...

TerryZ
2017/09/04
1K
15
jQuery.bsgrid 1.21 发布 简单易用的jQuery Grid插件

jQuery.bsgrid 简单易用的jQuery Grid插件 jquery bsgrid,A simple jQuery Grid plugin with pagation, export and easy to expand. 一个简单易用的jQuery Grid插件,支持分页或不分页,支持......

bs2004
2014/10/17
6.8K
17

没有更多内容

加载失败,请刷新页面

加载更多

利用mybatis generator生成实体类、Mapper接口以及对应的XML文件

项目中通常会遇到数据的持久化,如果是采用mybatis的orm,就会涉及到生成xml的问题,刚好mybatis官网提供了这么个插件MyBatis Generator,效果简直是棒呆。 1. 首先需要在build.gradle文件中...

啊哈关关
今天
2
0
SpringSocial相关的知识点

使用SprigSocial开发第三方登录 核心类 ServiceProvider(AbstractOauth2ServiceProvider):主要负责实现server提供商(例如QQ,微信等共有的东西),默认实现类是AbstractOauth2ServiceProvider...

chendom
今天
1
0
Java并发之AQS详解

一、概述   谈到并发,不得不谈ReentrantLock;而谈到ReentrantLock,不得不谈AbstractQueuedSynchronizer(AQS)!   类如其名,抽象的队列式的同步器,AQS定义了一套多线程访问共享资源...

群星纪元
昨天
2
0
Fabric-sdk-java最新教程

Fabric Java SDK是Fabric区块链官方提供的用于Java应用开发的SDK,全称为Fabric-sdk-java,网上可用资料不多,本文列出了精心整理的针对Fabric Java SDK的最新精选教程。 如果希望快速掌握F...

汇智网教程
昨天
2
0
react 子组件监听props 变化

componentWillReceiveProps //已经被废弃 getDerivedStateFromProps// 推荐使用//如果条件不存在必须要返回null static getDerivedStateFromProps(props, current_stat...

一箭落旄头
昨天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部