Easyui Datagrid rownumbers行号四位、五位显示不完全的解决办法

第一种：扩展方法



代码：

$.extend($.fn.datagrid.methods, {

fixRownumber : function (jq) {

return jq.each(function () {

var panel = $(this).datagrid("getPanel");

//获取最后一行的number容器,并拷贝一份

var clone = $(".datagrid-cell-rownumber", panel).last().clone();

//由于在某些浏览器里面,是不支持获取隐藏元素的宽度,所以取巧一下

clone.css({

"position" : "absolute",

left : -1000

}).appendTo("body");

var width = clone.width("auto").width();

//默认宽度是25,所以只有大于25的时候才进行fix

if (width > 25) {

//多加5个像素,保持一点边距

$(".datagrid-header-rownumber,.datagrid-cell-rownumber", panel).width(width + 5);

//修改了宽度之后,需要对容器进行重新计算,所以调用resize

$(this).datagrid("resize");

//一些清理工作

clone.remove();

clone = null;

} else {

//还原成默认状态

$(".datagrid-header-rownumber,.datagrid-cell-rownumber", panel).removeAttr("style");

}

});

}

});

调用:
$("#easyui-datagrid").datagrid({

onLoadSuccess : function () {

$(this).datagrid("fixRownumber");

}

});

第二种方法：直接设置行号栏的宽度,修改了样式，临时解决方案


.datagrid-header-rownumber,.datagrid-cell-rownumber{

width:40px;

}

推荐使用扩展