layui-v2.4.5 表头本地存储记忆功能

最新推荐文章于 2024-08-21 08:56:49 发布

qq_21125213

最新推荐文章于 2024-08-21 08:56:49 发布

阅读量582

点赞数 1

文章标签： javascript

原文链接：https://blog.csdn.net/zskg2010/article/details/106250842/

版权

亲测可用，引用的是layui.all.js进行开发，对图例代码进行调整
1、找到F.prototype.events = function () { var e, i = this, a = i.config, o = t(“body”), c = {}, s = i.layHeader.find(“th”), h = “.layui-table-cell”, p = a.elem.attr(“lay-filter”);这一块代码，再下面加上以下代码：
在这里插入图片描述

代码

// An highlighted block
var tableFlag = window.location.pathname.replace(new RegExp('/', 'g'), "_");
        if (tableFlag != "") {
            var deploy = localStorage.getItem("TableHidden" + tableFlag + "");
            var arr = new Boolean(deploy) ? eval(deploy) : [];
            if (arr) {
                $.each(arr, function (index, ele) {
                    var checked = ele.check;
                    var key = ele.key;
                    var parentKey = ele.parentKey;
                    layui.each(o.cols, function (i1, item1) {
                        layui.each(item1, function (i2, item2) {
                            if (i1 + '-' + i2 === key) {
                                var hide = item2.hide;
                                //同步勾选列的hide值和隐藏样式
                                item2.hide = !checked;
                                //根据列的显示隐藏，同步多级表头的父级相关属性值
                                if (hide != item2.hide) {
                                    // console.log(o.index + '-' + key);
                                    // a.setParentCol(!checked, parentKey);
                                    a.elem.find('*[data-key="' + o.index + '-' + key + '"]')[checked ? 'removeClass' : 'addClass']('layui-hide');
                                }
                                //重新适配尺寸
                                a.resize();
                            }
                        })
                    })
                })
            }
        };

2、找到LAYTABLE_COLS
加如下代码页面勾选列名将其持久化到本地localStorage
在这里插入图片描述

代码

// An highlighted block
var tableFlag = window.location.pathname.replace(new RegExp('/', 'g'), "_");
        if (tableFlag != "") {
                                    var tableHidden = "";
                                    $('.layui-unselect.layui-form-checkbox').each(function (index, ele) {
                                        var key = $(ele).siblings('input').attr('data-key');
                                        var parentkey = $(ele).siblings('input').attr('name');
                                        var checked = $(ele).attr('class').indexOf('layui-form-checked') !== -1 ? true : false;
                                        tableHidden += "{'key':'" + key + "','check':" + checked + ",'parentKay':'" + parentkey + "'},";
                                    })
                                    localStorage.setItem("TableHidden" + tableFlag + "", "[" + tableHidden + "]");
                                    //end
                                }