grid-tooltip扩展方法
调用:
$('#dg').datagrid('doCellTip', { 'max-width': '100px' });
/**
* 扩展两个方法
*/
$.extend($.fn.datagrid.methods, {
/**
* 开打提示功能
* @param {} jq
* @param {} params 提示消息框的样式
* @return {}
*/
doCellTip: function (jq, params) {
function showTip(data, td, e) {
if ($(td).text() == "")
return;
data.tooltip.text($(td).text()).css({
top: (e.pageY + 10) + 'px',
left: (e.pageX + 20) + 'px',
'z-index': $.fn.window.defaults.zIndex,
display: 'block'
});
};
return jq.each(function () {
var grid = $(this);
var options = $(this).data('datagrid');
if (!options.tooltip) {
var panel = grid.datagrid('getPanel').panel('panel');
var defaultCls = {
'border': '1px solid #333',
'padding': '2px',
'color': '#333',
'background': '#f7f5d1',
'position': 'absolute',
'max-width': '200px',
'border-radius': '4px',
'-moz-border-radius': '4px',
'-webkit-border-radius': '4px',
'display': 'none'
}
var tooltip = $("<div id='celltip'></div>").appendTo('body');
tooltip.css($.extend({}, defaultCls, params.cls));
options.tooltip = tooltip;
panel.find('.datagrid-body').each(function () {
var delegateEle = $(this).find('> div.datagrid-body-inner').length ? $(this).find('> div.datagrid-body-inner')[0] : this;
$(delegateEle).undelegate('td', 'mouseover').undelegate('td', 'mouseout').undelegate('td', 'mousemove').delegate('td', {
'mouseover': function (e) {
if (params.delay) {
if (options.tipDelayTime)
clearTimeout(options.tipDelayTime);
var that = this;
options.tipDelayTime = setTimeout(function () {
showTip(options, that, e);
}, params.delay);
}
else {
showTip(options, this, e);
}
},
'mouseout': function (e) {
if (options.tipDelayTime)
clearTimeout(options.tipDelayTime);
options.tooltip.css({
'display': 'none'
});
},
'mousemove': function (e) {
var that = this;
if (options.tipDelayTime)
clearTimeout(options.tipDelayTime);
//showTip(options, this, e);
options.tipDelayTime = setTimeout(function () {
showTip(options, that, e);
}, params.delay);
}
});
});
}
});
},
/**
* 关闭消息提示功能
*
* @param {}
* jq
* @return {}
*/
cancelCellTip: function (jq) {
return jq.each(function () {
var data = $(this).data('datagrid');
if (data.tooltip) {
data.tooltip.remove();
data.tooltip = null;
var panel = $(this).datagrid('getPanel').panel('panel');
panel.find('.datagrid-body').undelegate('td', 'mouseover').undelegate('td', 'mouseout').undelegate('td', 'mousemove')
}
if (data.tipDelayTime) {
clearTimeout(data.tipDelayTime);
data.tipDelayTime = null;
}
});
}
});
grid-tooltip扩展方法的更多相关文章
- EasyUI扩展方法
EasyUI扩展方法: 1.我想指定textarea的行,但editor:{type:'textarea', options: {rows:'4'}}这样写不行.请问大家怎么配置才是指定行的啊? 配置 ...
- 用扩展方法实现DevExpress-GridControl级联效果
首先,让我们先回顾下.Net中扩展方法的特征: 1. 必须在一个非嵌套.非泛型的静态类中: 2. 至少有一个参数(this 作前缀的参数): 3. 第一个参数必须附加this做前缀: 4. 第 ...
- .NET Core中间件的注册和管道的构建(3) ---- 使用Map/MapWhen扩展方法
.NET Core中间件的注册和管道的构建(3) ---- 使用Map/MapWhen扩展方法 0x00 为什么需要Map(MapWhen)扩展 如果业务逻辑比较简单的话,一条主管道就够了,确实用不到 ...
- .NET Core中间件的注册和管道的构建(2)---- 用UseMiddleware扩展方法注册中间件类
.NET Core中间件的注册和管道的构建(2)---- 用UseMiddleware扩展方法注册中间件类 0x00 为什么要引入扩展方法 有的中间件功能比较简单,有的则比较复杂,并且依赖其它组件.除 ...
- 为IEnumerable<T>添加RemoveAll<IEnumerable<T>>扩展方法--高性能篇
最近写代码,遇到一个问题,微软基于List<T>自带的方法是public bool Remove(T item);,可是有时候我们可能会用到诸如RemoveAll<IEnumerab ...
- C#的扩展方法解析
在使用面向对象的语言进行项目开发的过程中,较多的会使用到“继承”的特性,但是并非所有的场景都适合使用“继承”特性,在设计模式的一些基本原则中也有较多的提到. 继承的有关特性的使用所带来的问题:对象的继 ...
- 扩展方法(C#)
扩展方法使你能够向现有类型“添加”方法,而无需创建新的派生类型.重新编译或以其他方式修改原始类型.扩展方法是一种特殊的静态方法,但可以像扩展类型上的实例方法一样进行调用. 下面的示例为String添加 ...
- 扩展方法解决LinqToSql Contains超过2100行报错问题
1.扩展方法 using System; using System.Collections.Generic; using System.Linq; using System.Web; using Sy ...
- C#扩展方法
扩展方法使您能够向现有类型“添加”方法,而无需创建新的派生类型.重新编译或以其他方式修改原始类型. 扩展方法就相当于一个马甲,给一个现有类套上,就可以为这个类添加其他方法了. 马甲必须定义为stati ...
- 枚举扩展方法获取枚举Description
枚举扩展方法 /// <summary> /// 扩展方法,获得枚举的Description /// </summary> /// <param name="v ...
随机推荐
- 2014年七月最佳jQuery插件荟萃
本月的jQuery插件荟萃我们将介绍几款非常不错的jQuery插件,涵盖了表单,幻灯,页面设计等等方面,相信大家肯定会喜欢! Select or Die 一款帮助开发者美化并且强化选择框的jQuery ...
- android DPI与分辨率的关系及计算方式
android DPI与分辨率的关系及计算方式 Low density (120), ldpi Medium density (160), mdpi High density (240 ...
- T-SQL 之 运行时生成语句
一.用EXECUTE执行动态命令 EXECUTE命令可以执行存储过程.函数和动态的字符串命令.注意此语句的作用正如前面在介绍批处理时,如果批中的第一条语句是"EXECUTE Proc_nam ...
- Ubuntu 64位安装32位运行库
sudo apt-get install ia32-libs 32-64sudo apt-get install libc6:i386sudo apt-get install librt:i386su ...
- object sender, LinkLabelLinkClickedEventArgs e 参数解释
开始是一个LinkLabel 控件,LinkLabel 绑定了Clicke事件 LinkLabel Delete = new LinkLabel(); Delete.Text = "删除&q ...
- HDU 1595 find the longest of the shortest【次短路】
转载请注明出处:http://blog.csdn.net/a1dark 分析:经典的次短路问题.dijkstra或者SPFA都能做.先找出最短路.然后依次删掉没条边.为何正确就不证明了.了解思想直接A ...
- proxy [ˈprɒksi] 代理
谷歌.QQ支持,360.搜狗不支持 使用proxy代理可以实现,对原先的类不进行处理,新建一个类,对此进行拦截处理,以实现低耦合 可以通过代理拦截的方法,将方法进行重写. //------------ ...
- 解构赋值 和 symbol
1.数组解构 let [a,b,c,d] = ['aa','bb',77,88] 嵌套数组解构 let [a,b,[c,d],e] = ['aa','bb',[33,44],55] 空缺变量 let ...
- JavaScript 数组方法处理字符串 prototype
js中数组有许多方法,如join.map,reverse.字符串没有这些方法,可以“借用”数组的方法来处理字符串. <!doctype html> <html lang=" ...
- Eclipse/Myeclipse中查看和调试JDK源代码的方法
看过这篇文章后,实践写的 http://blog.csdn.net/qq_27857857/article/details/71250401 一共做了以下几部: 第一步: 第二步: 一直next,到第 ...