easyui Datagrid方法扩展 - tooltip
2016-03-17 21:04
549 查看
最新版本的jQuery Easyui新出来了一个组件叫tooltip,就是提示框。以前的版本没有这个组件的时候就有很多在问,datagrid的单元格,我要加鼠标提示要怎么做。原来我告诉他们的方法都是用formatter,大概方法如下:
这样的方式就利用了浏览器自己的title特性,来达到显示效果。只是这种实现效果还不是非常里想。值得庆幸的是从1.3.3+的版本之后有了tooltip组件我就可以更进一步的自定义我们的提示信息了。
具体扩展方法如下:
原文地址:http://www.jeasyuicn.com/the-extended-datagrid-method---tooltip.html
formatter:function(value){ return '<span title="'+value+'">'+value+'<span>'; }
这样的方式就利用了浏览器自己的title特性,来达到显示效果。只是这种实现效果还不是非常里想。值得庆幸的是从1.3.3+的版本之后有了tooltip组件我就可以更进一步的自定义我们的提示信息了。
具体扩展方法如下:
/** * Datagrid扩展方法tooltip 基于Easyui 1.3.3,可用于Easyui1.3.3+ * 简单实现,如需高级功能,可以自由修改 * 使用说明: * 在easyui.min.js之后导入本js * 代码案例: * $("#dg").datagrid({....}).datagrid('tooltip'); 所有列 * $("#dg").datagrid({....}).datagrid('tooltip',['productid','listprice']); 指定列 * @author ____′↘夏悸 */ $.extend($.fn.datagrid.methods, { tooltip : function (jq, fields) { return jq.each(function () { var panel = $(this).datagrid('getPanel'); if (fields && typeof fields == 'object' && fields.sort) { $.each(fields, function () { var field = this; bindEvent($('.datagrid-body td[field=' + field + '] .datagrid-cell', panel)); }); } else { bindEvent($(".datagrid-body .datagrid-cell", panel)); } }); function bindEvent(jqs) { jqs.mouseover(function () { var content = $(this).text(); $(this).tooltip({ content : content, trackMouse : true, onHide : function () { $(this).tooltip('destroy'); } }).tooltip('show'); }); } } });
原文地址:http://www.jeasyuicn.com/the-extended-datagrid-method---tooltip.html
相关文章推荐
- UITableViewdataSourse的协议所有方法
- VSTO学习(四)——自定义Excel UI 转载
- iOS开发基础控件--标签(UILabel)
- UEditor-golang
- easyui datagrid 键盘上下控制选中行
- UIScrollView和UIPageController
- String StringBuffer StringBuilder
- iOS segue 页面跳转传值
- 微信 weui 初体验
- CefSharp之三-如何获取request和response
- codeforces/conteset/644BProcessing Queries(模拟)
- UItableView的编辑--删除移动cell
- 刷了MIUI的手机在OSX下连接USB调试的方法
- XIB中设置UITextField的高度
- IOS控件学习之UIScrollView(3)
- HDU 1005 Number Sequence
- 再也不用管UIImagePicker的代理了
- IOS控件学习之UIScrollView(2)
- 项目:BluetoothChat
- 1570: [JSOI2008]Blue Mary的旅行 最大流