/**
* 扩展两个方法
*/
$.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;
}
});
}
});

easyui添加删除tooltip的更多相关文章

  1. EasyUI datagrid 删除的时候无法正确找到重复记录row index的问题

    EasyUI datagrid 删除的时候无法正确找到重复记录row index的问题: 如果无法正确找到重复记录的row index,就需要进行注意添加的时候所进行的 操作:如果添加的时候就是添加的 ...

  2. WPF下的Richtextbox中实现表格合并,添加删除行列等功能

    .Net中已有现在的方法实现这些功能,不过可能是由于未完善,未把方法公开出来.只能用反射的方法去调用它. 详细信息可以查看.Net Framework 的源代码 http://referencesou ...

  3. 编辑 Ext 表格(一)——— 动态添加删除行列

    一.动态增删行 在 ext 表格中,动态添加行主要和表格绑定的 store 有关, 通过对 store 数据集进行添加或删除,就能实现表格行的动态添加删除.   (1) 动态添加表格的行  gridS ...

  4. Angular-表单动态添加删除

    angular本身不允许去操作DOM,在angular的角度来说,所有操作都以数据为核心,剩下的事情由angular来完成.所以说,想清楚问题的根源,解决起来也不是那么困难. 前提 那么,要做的这个添 ...

  5. 用Javascript动态添加删除HTML元素实例 (转载)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. [CentOS]添加删除用户

    摘要 在安装CentOS的时候,我们只设置了root,类似windows的超级管理员.当然我们在工作的时候,为了安全考虑,不可能对外开发root,一方面是从安全的角度,另一方面也是方便管理. 添加删除 ...

  7. iOS仿网易新闻栏目拖动重排添加删除效果

    仿网易新闻栏目选择页面的基本效果,今天抽了点时间教大家如何实现UICollectionView拖动的效果! 其实实现起来并不复杂,这里只是基本的功能,没有实现细节上的修改,连UI都是丑丑的样子,随手画 ...

  8. 百度地图API示例之添加/删除工具条、比例尺控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  9. Android 动态添加删除ExpandableListView的item的例子

    这个例子可以学习到如下几点: 1.通过自定义Dialog(单独布局的xml文件进行弹出显示) 2.通过menu点击监听添加,删除view中的items 3.点击ExpandableListView中g ...

随机推荐

  1. UVA11402 - Ahoy, Pirates!(线段树)

    UVA11402 - Ahoy, Pirates!(线段树) option=com_onlinejudge&Itemid=8&category=24&page=show_pro ...

  2. Eclipse Kepler SR2 + Python 3.4 + JDK7+Pydev3.4 搭建 python 开发环境(MAC)

    Eclipse Kepler SR2 + Python 3.4 + JDK7+Pydev3.4 搭建 python 开发环境(MAC) 此为mac开发环境 一:下载所需软件: Eclipse Kepl ...

  3. Global Times 单词(日常收集)

    1. 2013-09-09 windfall 英[ˈwɪndfɔ:l] 美[ˈwɪndˌfɔl] n.意外之财:被风吹落的果子:意外的收获 eg:Only half made any attempt ...

  4. 【Linux】touch命令

    用途 touch命令参数可更改文档或目录的日期时间,包括存取时间和更改时间. 全称 touch全称即为touch 参数 -a   :或--time=atime或--time=access或--time ...

  5. 【NEWS】 ADempiere发布ADempiere 3.8.0路线图【2013年7月28日】

    发布源:http://osssme.org/cms/?q=node/17 本以为ADempiere”已死“,但是看到ADempiere的WIKI上大概在从5月28日开始添加WIKI以来,经过多次更新后 ...

  6. mybatis实战教程(mybatis in action)之三:实现数据的增删改查

    前面已经讲到用接口的方式编程.如果不一致就会出错,这一章主要在上一讲基于接口编程的基础上完成如下事情:1. 用 mybatis 查询数据,包括列表2. 用 mybatis 增加数据3. 用 mybat ...

  7. mosquitto 启动命令

    启动命令 mosquitto [-c config file] [ -d | --daemon ] [-p port number] [-v] -c 后面跟的是启动mosquitto可以调整的参数,比 ...

  8. poj 3691 DNA repair(AC自己主动机+dp)

    DNA repair Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 5877   Accepted: 2760 Descri ...

  9. dbcp数据库连接池管理

    该包主要是管理数据库的链接,获取链接.释放连接.设置最大连接数.初始化连接数.回收的空闲时间 在连接数据库时创建一个连接池可以很方便的管理所有数据库链接,和高效的使用数据库连接. 主要的两个对象是Ba ...

  10. JEECG 简单实例讲解权限控制

    业务背景:某公司要实现一个日志系统,用来了解员工的工作量饱和情况. 需求: 1.角色分为:员工.经理 两种. 2.员工每天在日志系统中填报工作总结,然后经理进行点评. 3.表单内容包含:姓名.日期.工 ...