EXTJS 4.2 实现 gridpanel 鼠标悬停单元格以提示信息的方式显示单元格内容。
由于gridpanel的单元格里的文字太多时候,都由省略号代替,就想实现如题的功能,经过反复实验,终于搞定了!直接上代码:
me.on('itemmouseenter', function (view, record, item, index, e, eOpts) {
if (view.tip == null) { //这块判断很重要,不能每次都创建个tooltip,要不显示会有问题。
view.tip = Ext.create('Ext.tip.ToolTip', {
// The overall target element.
target: view.el,
// Each grid row causes its own separate show and hide.
delegate: view.itemSelector,
// Moving within the row should not hide the tip.
// trackMouse: false,
// Render immediately so that tip.body can be referenced prior to the first show.
renderTo: Ext.getBody()
});
};
var gridColums = view.getGridColumns();
var column = gridColums[e.getTarget(view.cellSelector).cellIndex];
view.el.clean();
view.tip.update(record.data[column.dataIndex]);
});
解释下:这里截取主要的代码,实际中,就是监听你的表格itemmouseenter这个事件就行了! 效果如图!
EXTJS 4.2 实现 gridpanel 鼠标悬停单元格以提示信息的方式显示单元格内容。的更多相关文章
- 如何使用phantomJS来模拟一个HTML元素的鼠标悬停
如何使用phantomJS来模拟一个HTML元素的鼠标悬停 (How to use phantomJS to simulate mouse hover on a HTML element) 转 htt ...
- 实习小白笔记一(鼠标悬停、获取多选、提交修改、layer页面、单元格文字长度、json、分页、左连接)
①easyui 当鼠标悬停显示单元格信息: $(this).datagrid('doCellTip',{'max-width':'600px','delay':300}); ②jquery 获取che ...
- EasyUI Datagrid 鼠标悬停显示单元格内容 复制代码
EasyUI Datagrid 鼠标悬停显示单元格内容 ,halign:, align: 0 « 上一篇:LINQ to Entities 中的查询» 下一篇:去掉字符串中的非数字字符 posted ...
- EasyUI的Datagrid鼠标悬停显示单元格内容
功能描述:table鼠标悬停显示单元格内容 1.js函数 function hoveringShow(value) { return "<span title='" + va ...
- Selenium处理页面---弹窗、表格、鼠标悬停、frame、下拉框、上传文件
一.Selenium测试-常用页面处理 1.概述 UI自动化测试(GUI界面层):UI层是用户使用产品的入口,所有功能通过这一层提供给用户,测试工作大多集中在这一层,常见的测试工具有UFT.Robot ...
- CSS3鼠标悬停图片上浮显示描述代码
效果:http://hovertree.com/texiao/css3/20/ 效果图: 代码如下: <!doctype html> <html lang="zh" ...
- js设置鼠标悬停改变背景色
看了网上那么多的js鼠标悬停时事件,大多数的,说了那么多话,也没解决什么问题,现在直接贴上代码,以供参考 html: <div id="sign">this is te ...
- wpf ListView DataTemplate方式的鼠标悬停和选中更改背景色
今天使用wpf技术弄一个ListView的时候,由于需求需要,需要ListView显示不同的数据模板,很自然的使用了DataTemplate方式来定义多个数据模板,并在ListView中使用ItemT ...
- jQuery css3鼠标悬停图片显示遮罩层动画特效
jQuery css3鼠标悬停图片显示遮罩层动画特效 效果体验:http://hovertree.com/texiao/jquery/39/ 效果图: 源码下载:http://hovertree.co ...
随机推荐
- CCF软考---《有趣的数》
脑子一热报了CCF的软测..但是又觉得好像并没有什么卵用,就当为蓝桥杯预热然后顺便去软件学院玩一玩吧,遇到一个有意思的题: time limits : 1s 问题描述 我们把一个数称为有趣的,当且仅当 ...
- hdu 4512 吉哥系列故事——完美队形I_LCIS
题目链接 题意: 假设有n个人按顺序站在他的面前,他们的身高分别是h[1], h[2] ... h[n],吉哥希望从中挑出一些人,让这些人形成一个新的队形,新的队形若满足以下三点要 求,则就是新 ...
- javascript笔记7之对象数组
/* var box = new Array(); //声明一个数组,空数组 alert(typeof box); //数组属于object类型 var box = new Array('李炎恢', ...
- struts的ognl.NoConversionPossible错误
JSP页面便利集合的时候,代码如下 <s:iterator value="storageList" id="stList" status="st ...
- 使用vue-cli脚手架安装的eslint 容易犯错的地方
1. 函数名字与括号之间要有空格. 2. 不要使用双引号 3. 不要有多月的空行 4.函数参数的逗号后要有空格 5.每个结束语句以后不用加“分号”
- Pojo和JavaBean的区别(转载)
OJO(Plain Old Java Object)这个名字用来强调它是一个普通java对象,而不是一个特殊的对象. 2005年11月时,“POJO”主要用来指代那些没用遵从特定的Java对象模型,约 ...
- 自定义VS的ItemTemplates 实现任意文件结构
上一篇说到重写IHttpHandler实现前后端分离,这次说一下如何建立一个如下文件结构. VS建立webform时是根据模板来的.C#的模板目录如下: F:\Program Files (x86)\ ...
- 《第一行代码》学习笔记30-内容提供器Content Provider(3)
1."如何在自己的程序中访问其他应用程序的数据",思路->获取到该应用程序的内容URI,再借助ContentResolver进行CRUD操作. 2.要实现跨程序共享数据-&g ...
- unison实时双向数据同步
软件下载 ocamlopt下载地址:http://caml.inria.fr Unison下载地址:http://www.seas.upenn.edu/~bcpierce/unison 1.安装uni ...
- redis基础操作
/** * redis的Java客户端Jedis测试验证 * * @author */ public class Test { /** * 非切片客户端链接 */ private Jedis jedi ...
