宇筱博客

  • 解决办法
  • 学无止境
  • 记录时光
  • 百宝箱
宇筱博客
点滴记忆,汇聚成海。
  1. 首页
  2. 解决办法
  3. 正文

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

2017年1月9日 545点热度 0人点赞 0条评论

第一种:扩展方法

$(function(){
    /**
     * datagrid扩展
     */
	$.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");
    }
});

第二种解决方法:修改easyui.css中的两个值就可以了。默认是25px

.datagrid-header-rownumber,.datagrid-cell-rownumber{
   width:40px;
 }

原文链接:http://blog.csdn.net/u012481520/article/details/52953898

标签: 暂无
最后更新:2017年1月9日

小渔民

这个人很懒,什么都没留下

点赞
< 上一篇
下一篇 >

文章评论

razz evil exclaim smile redface biggrin eek confused idea lol mad twisted rolleyes wink cool arrow neutral cry mrgreen drooling persevering
取消回复

COPYRIGHT © 2025 宇筱博客. ALL RIGHTS RESERVED.

Theme Kratos Made By Seaton Jiang

豫ICP备15017825号-2