easyui扩展 - 鼠标放上后浮动提示

最新推荐文章于 2023-05-25 11:07:15 发布

hichinamobile

最新推荐文章于 2023-05-25 11:07:15 发布

阅读量3.3k

点赞数 1

分类专栏： easyui

本文链接：https://blog.csdn.net/hichinamobile/article/details/51192566

版权

本文介绍了如何在EasyUI框架中扩展功能，实现鼠标悬停元素时显示浮动提示的效果。通过自定义样式和JavaScript代码，使得用户交互体验更加友好。

摘要由CSDN通过智能技术生成

/**
 * 表格提示
 */
$.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();
				if(content && content!=""){
					$(this).tooltip({
						content : content,
						trackMouse : true,
						deltaX: 15,
						deltaY: -5,
						onShow: function(){
		                    $(this).tooltip('tip').css({
		                    	backgroundColor: '#f7f5d1',