EasyUI datagrid单元格文本超出显示省略号,鼠标移动到单元格显示文本
nowrap : true; 是前提
$('#×××').datagrid({
nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取
});
省略号样式:
<style type="text/css">
.datagrid-cell, .datagrid-cell-group, .datagrid-header-rownumber, .datagrid-cell-rownumber
{
text-overflow: ellipsis;
}
</style>
鼠标移动到单元格显示文本
<th data-options="field:'×××',width:70,align:'center',formatter:show1">×××</th>
代码1:
function show1(val,row){
if (val){
return '<span style="font-size:15px" title="' + val + '">' + val + '</span>';
} else {
return val;
}
}
代码2:
function show2(value, row, index){
var content = '';
if(value != undefined && value != '' && value != null ){
var abValue = value +'';
content = '<a style="font-size:15px" href="javascript:void(0);" title="' + abValue + '" class="easyui-tooltip">' + abValue + '</a>';
}
return content;
}
EasyUI datagrid单元格文本超出显示省略号,鼠标移动到单元格显示文本的更多相关文章
- 不值一提,却又不得不提的“CSS文本超出部分省略号代替”
偶然看到一篇类似css技巧与经验总结的文章,其中有一部分非常熟悉,那就是“css控制元素内文本超出部分使用省略号代替”,一般实际工作中, 很多产品经理会对页面UI有这样的要求.还记得,第一次做这个功能 ...
- css中文本超出部分省略号代替
p{ width: 100px; //设置p标签宽度 white-space: nowrap; //文本超出P标签宽度不换行,而是溢出 overflow: hidden; //文本超出P标签,超出部分 ...
- html文本超出加省略号
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- 关于H5 移动端css 文本超出时省略号 失效的问题
之前写代码的时候遇到一个问题,就是用了下面这段css代码来让文字超出范围隐藏并显示省略号. overflow: hidden; text-overflow: ellipsis; display: -w ...
- 转:zTree树控件key配置之title:zTree树节点名称过长如何省略显示且鼠标移入节点上能够显示全称
当树节点的名称有些很长时,全部显示出来显得很拥挤的情况下,我们会想到用省略节点名称来代替,当鼠标移入节点时能够显示该节点的全称.这样我们应该如何做呢? 首先,我们要在树的节点内多增加一个属性用于设置该 ...
- css实现文本超出部分省略号显示
一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现: div { // 单行 white-space: nowrap; overflow: hidden; tex ...
- 使用CSS和JQuery实现表格单元格内容超出时部分隐藏,隐藏部分以...显示
1.使用CSS实现,给此单元格添加一个Class: width:130px; display:block; overflow:hidden; word-break:keep-all; white-sp ...
- easyui datagrid 列的内容超出所定义的列宽时,自动换行
定义表单 nowrap="false"可以使得列中的内容超出所定义的列宽是就会自动换行pagination : true, // 当true时在DataGrid底部显示一个分页工 ...
- css文本超出部分省略号&CSS强制换行总结
word-break:break-all单词截断自动换行 word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congra ...
- CSS文本超出用省略号代替的方法
{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
随机推荐
- 笔记本使用control线连接交换机
要求: 1.一台笔记本 2.一条usb转rj45串口线 (一端是usb口一端是网口) 连接步骤: usb口插入笔记本,网口插入交换机控制口(交换机上面一般会有标注) 直连步骤: 首先查看是哪个com口 ...
- 谈谈 ServerFul 架构
我写了一篇文章 <自己实现一个线程池> https://www.cnblogs.com/KSongKing/p/9803935.html , 其实 不仅仅 是 线程池, 中间件 层 的 ...
- 第一章 C#入门 (Windows窗体应用程序)(三)
[案例] 编写一个Windows窗体应用程序,窗体上有一个文本框和两个按钮([显示]和[清除]按钮). 单击[显示]时,文本框的背景变为蓝色并且居中显示“努力学习C#”: 单击[清除]按钮,文本框的背 ...
- docker4种网络最佳实战 --摘自https://www.cnblogs.com/iiiiher/p/8047114.html
考: http://hicu.be/docker-container-network-types docker默认3中网络类型 参考: https://docs.docker.com/engine/u ...
- 黄聪:解决Bootstrap模态框(modal)弹出后页面跑到顶部的办法
bootstrap 3.1.1 版本解决方案: body.modal-open { position: absolute !important; }
- 基础:位(bit)、字节(byte)、字符、编码之间的关系
1.位: 数据存储的最小单位.每个二进制数字0或者1就是1个位: 2.字节: 8个位构成一个字节:即:1 byte (字节)= 8 bit(位): 1 KB = 1024 B(字节): 1 MB = ...
- Flask--(项目准备)--添加日志
日志:记录程序运行的状态,在manage.py同级目录下创建logs文件夹 定义日志文件: import logging from logging.handlers import RotatingFi ...
- storj白皮书v3最全面解读,Docker创始人的加入能否扳倒AWS S3
Storj新发了白皮书v3,地址是:https://storj.io/storjv3.pdf. 这次白皮书一共有90页,看完还真要费不少时间.如果你没有时间看,可以看一下我这篇快速技术解读. 上次St ...
- LTE学习笔记(一)——背景知识
一.标准化组织 无线通信技术的演进离不开一些标准化组织. 1.ITU(International Telecommunication Union) 国际电信联盟,主要任务是制定标准,分配无线频谱资源, ...
- 使用Mechanize实现自动化表单处理
使用Mechanize实现自动化表单处理 mechanize是对urllib2的部分功能的替换,能够更好的模拟浏览器行为,在web访问控制方面做得更全面 mechanize的特点: 1 http, ...