jquery easyui datagrid 如何自适应分辨率宽度

最新推荐文章于 2019-08-07 23:05:33 发布

原创最新推荐文章于 2019-08-07 23:05:33 发布 · 719 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #ViewUI

JQuery EasyUI 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种使EasyUI Datagrid中的表格能够自适应不同屏幕分辨率的方法，通过使用JavaScript函数计算列宽来实现这一目标。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如果一开始接触easyui的童鞋们都知道，一个datagrid生成的table是不能到边的。如下:

[img]http://dl.iteye.com/upload/attachment/275396/94f9ed52-2c5e-3494-b819-c6e3e369724c.jpg" alt="" width="1248" height="201[/img]

如上图，右边会有一列空白。所有的列宽是由固定的像素决定。这样即使你定到边了，但是换个分辨率的话，就会走形。那么如何解决呢？如何让这些宽度自适应分辨率呢？

在苦思冥想的情况下，发现一方法,如下：

定义一个方法

function getWidth(percent){

return document.body.clientWidth*percent;

}

然后在columns中定义width这样做。

[code="js"]columns:[[
{title:'Base Information',colspan:3},
{field:'opt',title:'Operation',width:getWidth(0.1),align:'center', rowspan:2,
formatter:function(value,rec){
return 'Edit Delete';
}
}
],[[/code]

大家可以试试。