ExtJs 4: How To Add Grid Cell Tooltip
最近忙一个项目的时候需要实现鼠标移到grid的某一行上提示消息。花了半天时间才解决。在网上找很久终于有找到一个有用的。我的版本是extjs4.
效果如图
Ext.onReady(function () { // Init the singleton. Any tag-based quick tips will start working. Ext.tip.QuickTipManager.init(); Ext.widget('grid', { title: 'Users', store: { fields: ['name', 'email', 'comment'], data: [ { 'name': 'Lisa', 'email': 'lisa@simpsons.com', 'comment': 'some comment' }, { 'name': 'Bart', 'email': 'bart@simpsons.com', 'comment': 'comment' }, { 'name': 'Homer', 'email': 'home@simpsons.com', 'comment': 'some very long comment' }, { 'name': 'Marge', 'email': 'marge@simpsons.com', 'comment': 'some very very very very long comment' } ] }, columns: [ { header: 'Name', dataIndex: 'name', width: 100 }, { header: 'Email', dataIndex: 'email', width: 150 }, { header: 'comment', dataIndex: 'comment', flex: 1, renderer: function (value, meta, record) { var max = 15; meta.tdAttr = 'data-qtip="' + value + '"'; return value.length < max ? value : value.substring(0, max - 3) + '...'; } } ], width: 400, renderTo: 'output' }); });
参考的原文:http://ext4all.com/post/extjs-4-how-to-add-grid-cell-tooltip
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Java 中堆内存和栈内存上的数据分布和特点
· 开发中对象命名的一点思考
· .NET Core内存结构体系(Windows环境)底层原理浅谈
· C# 深度学习:对抗生成网络(GAN)训练头像生成模型
· .NET 适配 HarmonyOS 进展
· 手把手教你更优雅的享受 DeepSeek
· 腾讯元宝接入 DeepSeek R1 模型,支持深度思考 + 联网搜索,好用不卡机!
· AI工具推荐:领先的开源 AI 代码助手——Continue
· 探秘Transformer系列之(2)---总体架构
· V-Control:一个基于 .NET MAUI 的开箱即用的UI组件库