/**
* 扩展两个方法
*/
$.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' : '1px',
'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);
options.tipDelayTime = setTimeout(
function() {
showTip(options, that, e);
}, params.delay);
} else {
showTip(options, that, e);
}
}
});
});

}

});
},
/**
* 关闭消息提示功能
* @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;
}
});
}
});

function doCellTip(){
$('#mainGrid').datagrid('doCellTip',{'max-width':'100px'});
}
function cancelCellTip(){
$('#mainGrid').datagrid('cancelCellTip');
}

function doCellTip(){
$('#mainGrid').datagrid('doCellTip',{'max-width':'100px'});
}
function cancelCellTip(){
$('#mainGrid').datagrid('cancelCellTip');
}

datagrid鼠标悬浮提示相关推荐

  1. IDEA Translation插件安装及设置鼠标悬浮提示的自动翻译

    1.安装插件 Translation 2.设置鼠标悬浮提示 3.在代码界面鼠标悬停在方法上 就会自动翻译提示

  2. vue 富文本编辑器 quill (含代码高亮、自定义字体、汉化、鼠标悬浮提示、组件封装等)

    基本使用 安装依赖 npm i quill .vue文件 <div ref="editor" :style="finalStyle"></di ...

  3. IDEA相关配置(特别完整)看完此篇就将所有的IDEA的相关配置都配置好了、设置鼠标滚轮修改字体大小、设置鼠标悬浮提示、设置主题、设置窗体及菜单的字体及字体大小、设置编辑区主题、通过插件更换主题

    文章目录 1.创建模块(Module) 2.常用配置 2.1Appearance & Behavior 2.1.1设置主题 2.1.2设置窗体及菜单的字体及字体大小 (可忽略) 2.1.3补充 ...

  4. JAVAFX 鼠标悬浮提示 Tooltip组件

    Tooltip组件说明 Tooltip控件,它可以设置给任何UI控件,当鼠标移动到该控件上时Tooltip就会显示. Tooltip类表示一个常见的UI组件,它常用于为其他UI控件显示附加的信息.通过 ...

  5. quil-ediotr编辑器工具栏图表鼠标悬浮提示

    参考方法:https://blog.csdn.net/HH18700418030/article/details/120163842 遇到的问题: 1.无法获取dom元素问题 //生命周期-挂载完(可 ...

  6. idea2022修改鼠标悬浮提示时间

  7. IDEA设置鼠标悬浮提示时间

    参考 https://blog.csdn.net/qq_31772441/article/details/116075154

  8. layui使用tips_使用layer.tips实现鼠标悬浮时触发事件提示消息实现

    代码: 你瞅啥!?过来试试! 方法一: function show(id) { layer.tips("左边么么哒", "#"+id+"", ...

  9. quill鼠标悬浮 出现提示_外设报道——DELUX多彩M618X垂直鼠标颠覆创新

    如今,日常办公早已离不开电脑,键盘鼠标更是成为了大多数白领接触最多的外设.随着鼠标的长时间使用,越来越多的人出现"鼠标手"的不适症状.于是,符合人体工程学的立式设计垂直鼠标应运而生 ...

  10. 鼠标悬浮标签显示提示内容

    2019独角兽企业重金招聘Python工程师标准>>> 1.鼠标悬浮显示内容,可直接在标签里加个title 2.js实现 在标签里定义id 鼠标onmouseover 属性在鼠标指针 ...

最新文章

  1. ARM WFI和WFE指令
  2. php处理小程序上传图片,微信小程序上传图片,PHP-Laravel框架实现
  3. ASP中利用OWC控件实现图表功能详解[zz]
  4. 这个网盘搜索好像还不错
  5. 全局稳定性收敛平衡点为0吗_神经网络的稳定性阐明.pdf
  6. Spring Cloud异常
  7. 如何写一手好 SQL 【频繁出现慢SQL告警的优化方案】
  8. 计算4位数每位数相加之和(Python)
  9. H5源码口红机在线游戏无需公众号
  10. C51单片机——指令系统
  11. 关于flex的crossdomain.xml文件存放目录
  12. Spring5的几个新特性
  13. 一个桌面系统的微信公众号开发
  14. 打开我的计算机我的文档不见,我电脑桌面上的我的文档不见了,是什么原因造成我的文档不见了呢?是? 爱问知识人...
  15. html5 正式发布 2014,万维网联盟将于2014年推出HTML5标准
  16. 类和对象12:容器方法
  17. 快递单号中的派件时效该怎么查?
  18. 树莓派mysql重置密码_树莓派忘记密码了?四步重设密码 | 树莓派实验室
  19. [2022.1.13]UPC-2021级新生个人训练赛第22场-9783 Problem H 铺地砖
  20. 阿里巴巴成立科技伦理治理委员会 推动技术治理、践行“好科技”

热门文章

  1. Atitit 电子商务订单号码算法(java c# php js 微信
  2. Atitit.  单列索引与多列索引 多个条件的查询原理与设计实现
  3. Atitit。 《吠陀》 《梨俱吠陀》overview 经读后感  是印度上古时期一些文献的总称
  4. atitit。企业组织与软件工程的策略 战略 趋势 原则 attilax 大总结
  5. paip.提升用户体验---网站程序HTML,JS需要注意的地方
  6. Rust : RwLock读写锁
  7. 《证券基金经营机构信息技术管理办法》要点简读
  8. Blackrock的思考与启示
  9. (转)贝莱德,从0到6万亿
  10. 当遥感卫星有了AI……