1只有文本溢出的单元格鼠标经过才显示提示信息

$('.datagrid-cell').mouseover(function () {
if (this.offsetWidth < this.scrollWidth) {
var content = $(this).text();
$(this).tooltip({
content: content,
trackMouse: true,
onHide: function () {
$(this).tooltip('destroy');
}
}).tooltip('show');
}
});

//一下是绑定事件位置

Easyui.$myview = $.extend({}, $.fn.datagrid.defaults.view, {
onAfterRender: function (target) {
$.fn.datagrid.defaults.view.onAfterRender.call(this, target);
var opts = $(target).datagrid('options');
var vc = $(target).datagrid('getPanel').children('div.datagrid-view');
vc.children('div.datagrid-empty').remove();
if (!$(target).datagrid('getRows').length) {
var d = $('<div class="datagrid-empty"></div>').html(opts.emptyMsg || 'no records').appendTo(vc);
d.css({
position: 'absolute',
left: 0,
top: 50,
width: '100%',
textAlign: 'center'
});
}
$(target).datagrid("fixRownumber");//自适应rownumber
$('.datagrid-cell').mouseover(function () {
       //判断文本是否溢出
if (this.offsetWidth < this.scrollWidth) {
var content = $(this).text();
$(this).tooltip({
content: content,
trackMouse: true,
onHide: function () {
$(this).tooltip('destroy');
}
}).tooltip('show');
}
});
}
});
Easyui.datagrid = function (/*object*/options) {
var $dg = $('#' + options.datagridId);
var _options = $.extend({
loadMsg: '数据加载中,请稍后……',
method: 'post',
pageList: [15, 20, 30, 50],
pageSize: 50,
toolbar: '#dg_toorbar',
fit: true,
pagination: true,
border: false,
rownumbers: true,
striped: true,
view: Easyui.$myview,
singleSelect: true,
fitColumns: true,
emptyMsg: '未找到符合条件的数据',
cache: false
}, options);
if (options.formId && $(options.formId).form('validate')) {
_options.queryParams = $(options.formId).form('serialize');
}
$dg.datagrid(_options);
};

datagrid 文本溢出时候 鼠标经过出现提示信息tooltip的更多相关文章

  1. CSS之 元素显示隐藏,用户界面样式,文本溢出隐藏,精灵技术,三角形

    元素的显示与隐藏 display 显示 display 设置或检索对象是否及如何显示 display: none; 隐藏对象 display: block; 除了转换为块级元素, 同时还有显示元素的意 ...

  2. CSS3文本溢出显示省略号

    CCS3属性之text-overflow:ellipsis;的用法和注意之处 语法: text-overflow:clip | ellipsis 默认值:clip 适用于:所有元素 clip: 当对象 ...

  3. CSS换行文本溢出显示省略号

    现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...

  4. CSS---解决内容过多就会出文本溢出(显示在区域外面,不换行的情况)

    当我们设置我的的div,或者其它文本框固定宽度之后,文本内容过多就会出文本溢出(显示在区域外面,不换行的情况). 这时我们可以使用Css中的几个属于来解.有以下的三个属于可以解决问题: 1,word- ...

  5. 文本溢出text-overflow和文本阴影text-shadow

    前面的话 CSS3新增了一些关于文本的样式,其中text-overflow文本溢出和text-shadow文本阴影有些特别.因为它们有对应的overflow溢出属性和box-shadow盒子阴影属性. ...

  6. 设置text-overflow文本溢出隐藏时的对齐问题

    设置text-overflow: ellipsis后引起的文本对齐问题 最近在做网页的时候用到了文本溢出隐藏的功能,但是出现了一些小问题,下面先放上示例代码吧. <p> <span ...

  7. 浅谈文本溢出省略号代表修剪text-overflow

    一.示例 图片显示: HTML结构: CSS样式: 注意: CSS3 text-overflow 属性规定当文本溢出包含元素时发生的事情,其中 所有浏览器都支持 white-space 属性.  示例 ...

  8. 文本溢出text-overflow

    文本溢出text-overflow 问题:有一个新闻标题,标题宽度为200px,文字为宋体,加粗,文字大小为16px,颜色为黑色,行高为25px,要求单行显示,并且超出时显示“…”,请按要求完成效果. ...

  9. CSS文本溢出显示省略号

    项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英雄指教. 单行 语法 ...

随机推荐

  1. Orm 入门总指南

    注意:下面的pdf文件强烈建议下载或在线查看 1)旗舰版帮助文档点击查看或下载 2)http://pan.baidu.com/s/1hq7krFu(新手手册下载)(强烈推荐) 3)性能及规范下载,网友 ...

  2. Learn About Git Bash

    git是用来做版本控制的,在本节博客中,主要介绍git的下载,以及简单的配置 Version control is a system that records changes to a file or ...

  3. activiti学习7:spring和activiti进行整合

    目录 activiti学习7:spring和activiti进行整合 一.整合原理 二.整合步骤 2.1 新建一个maven工程并导入相关依赖 2.2 创建spring配置文件 三.测试 activi ...

  4. N x N 的矩阵,顺时针旋转

    第一种方法: 先打印外圈,再打印内圈 public class RotateMatrix1 { public static void rotate(int[][] matrix) { ; ; ; ]. ...

  5. Ext.net自动保存读取GrdPanel列显示状态

    //layout保存 function SaveLayOut() { let colVisibleArray = []; for (var i = 0; i < mcp_gridlist.col ...

  6. 【题解】Luogu P4091 [HEOI2016/TJOI2016]求和

    原题传送门 \[\begin{aligned} a n s &=\sum_{i=0}^{n} \sum_{j=0}^{i}\left\{\begin{array}{c}{i} \\ {j}\e ...

  7. 示例:在Nuget发布自己的包的步骤

    原文:示例:在Nuget发布自己的包的步骤 一.目的:很多时候都在用第三方的Nuget包,现成的轮子可以减少很多工作量,同时我们也可以造轮子供自己和其他人使用,本示例主要演示如何发布dll到Nuget ...

  8. 探索etcd,Zookeeper和Consul一致键值数据存储的性能

    这篇博文是探索三个分布式.一致性键值数据存储软件性能的系列文章中的第一篇:etcd.Zookeeper和Consul,由etcd团队所写,可以让我们全面地了解如何评估三个分布式一致存储软件的性能.翻译 ...

  9. SpringCloud-Consul开发环境配置

    一.consul安装 1.下载:https://www.consul.io/downloads.html: 2.选择版本:本人开发环境是windows,所以选择win64: 3.安装:保存至D:/Sp ...

  10. Python中的单例设计

    01. 单例设计模式 设计模式 设计模式 是 前人工作的总结和提炼,通常,被人们广泛流传的设计模式都是针对 某一特定问题 的成熟的解决方案 使用 设计模式 是为了可重用代码.让代码更容易被他人理解.保 ...