jqGrid启用列冻结之后列高度不一致问题解决办法

1.喜欢又憎恨的列冻结功能

jqGrid 4.3.0版本发布中包含了一个我期待已久的功能——列冻结。和Excel中的冻结效果一样，把需要一直显示的列固定显示，其他辅助的列横向滚动显示，可以参考jqGrid的列冻结演示：http://trirand.com/blog/jqgrid/jqgrid.html，打开页面之后选择”Frozen Cols.Group Header(new)”的“Frozen column”。

下图是正常情况：

但是，事情总是那么的不顺利……

从图中可以看出列：[Inv No，Date]是冻结的列，后面的是未冻结的列；未冻结的”Note“列内容太多导致分两行显示，问题就处在红色边框区域内，高度不一致。

2.解决办法

目前官方还没有发布解决办法，所以我先用hack的方式临时解决这个问题。对于高度不同又分为两种情况：冻结的列比未冻结的高，未冻结的列比冻结的高。

我专为此写了一个页面演示这种问题：

http://www.kafeitu.me/demo/jqgrid/frozen.html

读者打开演示页面之后点击按钮即可修复此问题，右键查看源码看我如何hack！！！

2.1 未冻结的列比冻结的列高度高

此种情况要读取未冻结列的高度，然后设置到冻结列的style中，但是不能用height()设置必须使用height: 20px !important方式，其中!important必须有，代码参考#32行处。

除了设置高度之外还需要根据浏览器的不同设置一个过渡值，见代码清单22~29行处。

问题请参考演示的第一个例子。

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 <