• Easyui Datagrid扩展fixRownumber方法


    首先,从datagrid生成的代码,我们可以发现,在rowNumber上都有特定的class标记,datagrid-cell-rownumber,datagrid-header-rownumber.

    $.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");
    }
    });
    }
    });

    JS:

    $("#easyui-datagrid").datagrid({
    onLoadSuccess : function () {
    $(this).datagrid("fixRownumber");
    }
    });

  • 相关阅读:
    js 变量的声明能提升 初始化不会提升
    老公教我写分页
    响应式布局
    闭包优缺点
    正则表达式验证邮箱格式
    DDL表和库管理语言
    DML数据库操作语言
    python实现求第K小
    硬币凑数
    MySQL学习的表单定义
  • 原文地址:https://www.cnblogs.com/huangf714/p/5898812.html
Copyright © 2020-2023  润新知