easyUI 鼠标悬停某行提示
最近参与公司的电子档案系统的开发,需求是需要用户鼠标悬停某一行时,需要根据后台业务数据进行提示。
档案系统开发采用的框架是struts2+mybatis+spring+easyUI开发,而前端的easyUI官方并不提供类似的功能,查找资料后,在别人的样本中找到了类似功能,通过流云大神开发的easyUI的拓展功能包实现鼠标悬停行提示,具体如下:
js代码片段:
$(function(){
$('#resultDatas').datagrid({
url:"/GTDA/CadastreManage/daScanMng_findLand_RegisterCardByStateForPage?status=2",
autoRowHeight:true,
rownumbers:true,
fitColumns:true,
fit:true,
pagination:true,
singleSelect:true,
columns:[[
{field:'arch_guid',title:'',align:'center',
formatter:function(value,row,index){
if(row.arch_guid==undefined||row.arch_guid=='') return ;
var del = '<div class="datagrid-cell-check" ><input type="checkbox" name="arch_guid" value=""/></div>';
return del;
}
},
{field:'archid',title:'档案编号',width:100,align:'center'},
{field:'archName',title:'题名',width:100,align:'center'},
{field:'qlr',title:'土地权利人',width:100,align:'center'},
{field:'tdzh',title:'土地证号',width:100,align:'center'},
{field:'zl',title:'坐落',width:100,align:'center'},
{field:'djk_guid',title:'',width:0,align:'center'},
{field:'returnMark',title:'',width:0,align:'center'},
]],
toolbar:'#tb',
onSelect: function(rowId,rowData){
selectId = rowData.djk_guid;
selectName = rowData.archid;
},
rowStyler: function(index,row){
if (row.returnMark == '1'){
return 'background-color:yellow;';
}
},
rowTooltip: function (index, row) {
console.info(row);
if(row.returnMark == '1'){
var text = "此档案为退回件(需修正)" ;
return $("<span></span>").css("color", "Red").text(text);
}
}
});
rowTooltip即通过拓展的插件实现的鼠标悬停提示。需要引入的插件如下:
script type="text/javascript" src="<%=path%>/scripts/easyui/jeasyui.extensions.datagrid.js"></script>
<script type="text/javascript" src="<%=path%>/scripts/easyui/jquery.jdirk.js"></script>
<script type="text/javascript" src="<%=path%>/scripts/easyui/jeasyui.extensions.js"></script>
<script type="text/javascript" src="<%=path%>/scripts/easyui/jeasyui.extensions.menu.js"></script>
<script type="text/javascript" src="<%=path%>/scripts/easyui/jeasyui.extensions.panel.js"></script>
最主要拓展包是:jeasyui.extensions.datagrid.js,其他的包是此包的拓展包。流云二次开发DEMO:http://sshe.jeasyuicn.com/index.jsp ,在此特别敬谢alongSelf(http://www.cnblogs.com/alongSelf/)提供的帮助。
easyUI 鼠标悬停某行提示的更多相关文章
- Bootstrap3基础 table-bordered/hover 表格加外边框和鼠标悬停对应行的背景色加深
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- 【IDE_PyCharm】PyCharm中配置当鼠标悬停时快速提示方法参数
方法一:通过在settings里面设置当鼠标至于方法之上时给出快速提示 方法二:按住Ctrl键,光标放在任意变量或方法上都会弹出该变量或方法的详细信息,点击鼠标还能跳转到变量或方法的定义处
- 扩充 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- EasyUI Datagrid 鼠标悬停显示单元格内容 复制代码
EasyUI Datagrid 鼠标悬停显示单元格内容 ,halign:, align: 0 « 上一篇:LINQ to Entities 中的查询» 下一篇:去掉字符串中的非数字字符 posted ...
- 兄弟连教育分享:用CSS实现鼠标悬停提示的方法
兄弟连教育分享:用CSS实现鼠标悬停提示的方法 本文,兄弟连HTML5培训,分享了纯CSS实现鼠标悬停提示的方法.给大家供大家参考.具体分析如下: 这是一款比较漂亮的鼠标悬停提示效果,用纯CSS代码实 ...
- JS基础(二)事件监听练习之table鼠标悬停行变色
JS监听事件简单学习: [object].addEvent("事件类型","处理函数","冒泡事件或捕获事件"); [object].r ...
- WPF ListView控件设置奇偶行背景色交替变换以及ListViewItem鼠标悬停动画
原文:WPF ListView控件设置奇偶行背景色交替变换以及ListViewItem鼠标悬停动画 利用WPF的ListView控件实现类似于Winform中DataGrid行背景色交替变换的效果,同 ...
- eclipse 鼠标悬停提示
如果想要关闭鼠标悬停提示,只要把Window --> Preferences... --> Java --> Editor --> Hovers 把 Combined Hove ...
随机推荐
- Unreal引擎术语表
转自:http://www.cnblogs.com/hmxp8/archive/2012/02/10/2345274.html Unreal引擎术语表 转载自UDN: Actor - 一个可以放置在 ...
- HTTP 2 VS HTTP 1.1
提升H5应用加载速度的方式有很多,比如缓存.cdn加速.代码压缩合并和图片压缩等技术. 今天介绍的是HTTP 2.0
- 用python做的windows和linx文件夹同步。解决自动同步、加快传输大量小文件的速度、更丰富的文件上传过滤设置。
现在工具不好用,用的pycharm自动同步,但对于git拉下来的新文件不能自动上传到linux,只有自己编辑过或者手动ctrl + s的文件才会自动同步.导致为了不遗漏文件,经常需要全量上传,速度非常 ...
- linux命令-vim命令模式
编辑模式下 按 “esc” 进去命令模式 :wq 保存并退出 :w 保存 已写入 :q!不保存强制退出 :wq! 强制保存退出 :set nu 显示行号 :set nonu 去掉行号 :nohl 取 ...
- shell判断网络主机存活
判断网络主机存活企业面试题4:写一个脚本,实现判断10.0.0.0/24网络里,当前在线用户的IP有哪些(方法有很多) #!/bin/sh#[ -f /etc/init.d/functions ] & ...
- macos上改变输入法顺序
设置界面上是不能拖放顺序的,唯一解决办法是: 一.先选择所有文档使用相同输入源 二.选择用美国英语 三.再选择允许多个输入源,再打开原来的中文输入法 顺序就调过来了!尼玛,这就是苹果的人性化?懒得吐嘈 ...
- xgene:肿瘤相关基因 KRAS,,BRAF,,通路PI3K-AKT
KRAS基因 一个是KRAS1,位于chr6 短臂上,是一个“假基因”,它不能被转录成RNA,故没有功能的 另一个是KRAS2,位于chr12 短臂上..是“真基因”,是能够转录.并且翻译成蛋白的,是 ...
- 16.Tomcat弱口令 && 后台getshell漏洞
Tomcat7+ 弱口令 && 后台getshell漏洞 Tomcat版本:8.0 环境说明 Tomcat支持在后台部署war文件,可以直接将webshell部署到web目录下.其中, ...
- 【OpenGL】Shader概述
目录(?)[-] 综述 编译一个Shader 链接一个Shader 删除一个Shader 指定使用一个Shader Program 删除一个Shader Program 备注 这篇文章讲述了Shade ...
- sqlserver2012——.Net
1.Connection 属性: ConnectionString:获取或者设置用于打开SQLServer数据库的字符串 Database:获取当前数据库或者连接打开后要使用的数据库名称 State: ...