转载注明地址:

之前效果:

之后效果:

需要说明一点的是,这个不是通过JS设置长度完成的,如果是JS那么用户拖动变宽之后,还需要监听变宽之后的情况,那么显的很麻烦

一下就来说明如何完成的:

第一步,用FF看easyUI结构;

那么下面就看看主要的代码:(仅仅几行而已)

$('#grid').datagrid({                	 onLoadSuccess:function(data){                         var div01=$("td[field='clinictotal'] div");                	                          div01.css({                          	 "width":div01.width(),                          	 "white-space":"nowrap",                          	 "text-overflow":"ellipsis",                          	 "-o-text-overflow":"ellipsis",                          	 "overflow":"hidden"                          	});                	 }});

$('#grid')

代表你的grid,是不是很简单!

下面来解释一下具体的意思:

white-space: nowrap;                width: 100%;                   /* IE6 needs any width */                overflow: hidden;              /* "overflow" value must be different from "visible" */                -o-text-overflow: ellipsis;    /* Opera 9-10 */                text-overflow:    ellipsis;    /* IE, WebKit (Safari, Chrome), Firefox 7, Opera 11 */