layui框架表格只支持数字排序,不能支持自定义排序,于是自己修改table.js模块源码增加了自定义排序功能
最开始研究修改的是layui2.1.2版本的 table.js
由于项目用的是layui2.2.5版本的,后面又改了一版这个版本的table.js
实现思路
在原排序数组每一项里新增临时数字类型的属性,再通过这个临时属性值进行排序
demo下载地址(本博文有两个版本修改后的源码,嫌下载麻烦的可以在本文直接复制)
2.1.2版本: https://download.csdn.net/download/lihefei_coder/10923718
2.2.5版本: https://download.csdn.net/download/lihefei_coder/10924023
注:需积分下载
使用方式
在initSort配置参数里新增了rule方法用来排序
//方法级渲染
var tableIns = table.render({
elem: '#demo',
cols: [
[
{ field: 'id', title: 'ID', width: 80 },
{ field: 'experience', title: '积分', width: 120, sort: true },
]
],
data: [
{ id: '10001', experience: '100a'},
{ id: '10002', experience: '20b'},
{ id: '10003', experience: '1100c'},
{ id: '10004', experience: '80d'},
{ id: '10005', experience: '900e'},
{ id: '10006', experience: '456f'},
{ id: '10007', experience: '32g'},
{ id: '10008', experience: '2004h'},
{ id: '10009', experience: '100i'},
{ id: '10010', experience: '1998j'}
],
initSort: {
field: 'experience', //排序字段,对应 cols 设定的各字段名
type: 'desc', //排序方式 asc: 升序、desc: 降序、null: 默认排序
rule: function(v, i, arr) { //v是指定排序的每一行的'experience'字段值,i 是每一行对应的下标, arr是表格所有行的dom数组
return parseInt(v); //此处写自己想要转化为数字的逻辑,每一行都是通过返回的这个数字进行排序
}
}
});
layui2.1.2版本修改后的 table.js
/** layui-v2.1.2 MIT License By http://www.layui.com */ ;
layui.define(["laytpl", "laypage", "layer", "form"], function(e) {
"use strict";
var t = layui.$,
i = layui.laytpl,
a = layui.laypage,
l = layui.layer,
n = layui.form,
o = layui.hint(),
r = layui.device(),
d = { config: { checkName: "LAY_CHECKED", indexName: "LAY_TABLE_INDEX" }, cache: {}, index: layui.table ? layui.table.index + 1e4 : 0, set: function(e) { var i = this; return i.config = t.extend({}, i.config, e), i }, on: function(e, t) { return layui.onevent.call(this, s, e, t) } },
c = function() {
var e = this,
t = e.config,
i = t.id;
return i && (c.config[i] = t), { reload: function(t) { e.reload.call(e, t) }, config: t }
},
s = "table",
u = ".layui-table",
f = "layui-hide",
h = "layui-table-view",
y = ".layui-table-header",
p = ".layui-table-body",
m = ".layui-table-main",
v = ".layui-table-fixed",
g = ".layui-table-fixed-l",
x = ".layui-table-fixed-r",
b = ".layui-table-tool",
k = ".layui-table-sort",
w = "layui-table-edit",
C = "layui-table-hover",
z = function(e) { return e = e || {}, ['<table cellspacing="0" cellpadding="0" border="0" class="layui-table" ', '{{# if(d.data.skin){ }}lay-skin="{{d.data.skin}}"{{# } }} {{# if(d.data.size){ }}lay-size="{{d.data.size}}"{{# } }} {{# if(d.data.even){ }}lay-even{{# } }}>', "<thead>", "{{# layui.each(d.data.cols, function(i1, item1){ }}", "<tr>", "{{# layui.each(item1, function(i2, item2){ }}", '{{# if(item2.fixed && item2.fixed !== "right"){ left = true; } }}', '{{# if(item2.fixed === "right"){ right = true; } }}', function() { return e.fixed && "right" !== e.fixed ? '{{# if(item2.fixed && item2.fixed !== "right"){ }}' : "right" === e.fixed ? '{{# if(item2.fixed === "right"){ }}' : "" }(), "{{# if(item2.checkbox){ }}", '<th data-field="{{ item2.field||i2 }}" data-type="checkbox" {{#if(item2.colspan){}} colspan="{{item2.colspan}}"{{#} if(item2.rowspan){}} rowspan="{{item2.rowspan}}"{{#}}} unresize="true"><div class="layui-table-cell laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary" lay-filter="layTableAllChoose" {{# if(item2[d.data.checkName]){ }}checked{{# }; }}></div></th>', "{{# } else if(item2.space){ }}", '<th data-field="{{ item2.field||i2 }}" {{#if(item2.colspan){}} colspan="{{item2.colspan}}"{{#} if(item2.rowspan){}} rowspan="{{item2.rowspan}}"{{#}}} unresize="true"><div class="layui-table-cell laytable-cell-space"></div></th>', "{{# } else { }}", '<th data-field="{{ item2.field||i2 }}" {{#if(item2.colspan){}} colspan="{{item2.colspan}}"{{#} if(item2.rowspan){}} rowspan="{{item2.rowspan}}"{{#}}} {{# if(item2.unresize){ }}unresize="true"{{# } }}>', "{{# if(item2.colspan > 1){ }}", '<div class="layui-table-cell laytable-cell-group" {{#if(item2.align){}}align="{{item2.align}}"{{#}}}>', '<span>{{item2.title||""}}</span>', "</div>", "{{# } else { }}", '<div class="layui-table-cell laytable-cell-{{d.index}}-{{item2.field||i2}}" {{#if(item2.align){}}align="{{item2.align}}"{{#}}}>', '<span>{{item2.title||""}}</span>', "{{# if(item2.sort){ }}", '<span class="layui-table-sort layui-inline"><i class="layui-edge layui-table-sort-asc"></i><i class="layui-edge layui-table-sort-desc"></i></span>', "{{# } }}", "</div>", "{{# } }}", "</th>", "{{# }; }}", e.fixed ? "{{# }; }}" : "", "{{# }); }}", "</tr>", "{{# }); }}", "</thead>", "</table>"].join("") },
F = ['<table cellspacing="0" cellpadding="0" border="0" class="layui-table" ', '{{# if(d.data.skin){ }}lay-skin="{{d.data.skin}}"{{# } }} {{# if(d.data.size){ }}lay-size="{{d.data.size}}"{{# } }} {{# if(d.data.even){ }}lay-even{{# } }}>', "<tbody></tbody>", "</table>"].join(""),
N = ['<div class="layui-form layui-border-box {{d.VIEW_CLASS}}" lay-filter="LAY-table-{{d.index}}" style="{{# if(d.data.width){ }}width:{{d.data.width}}px;{{# } }} {{# if(d.data.height){ }}height:{{d.data.height}}px;{{# } }}">', "{{# var left, right; }}", '<div class="layui-table-header">', z(), "</div>", '<div class="layui-table-body layui-table-main">', F, "</div>", "{{# if(left){ }}", '<div class="layui-table-fixed layui-table-fixed-l">', '<div class="layui-table-header">', z({ fixed: !0 }), "</div>", '<div class="layui-table-body">', F, "</div>", "</div>", "{{# }; }}", "{{# if(right){ }}", '<div class="layui-table-fixed layui-table-fixed-r">', '<div class="layui-table-header">', z({ fixed: "right" }), '<div class="layui-table-mend"></div>', "</div>", '<div class="layui-table-body">', F, "</div>", "</div>", "{{# }; }}", "{{# if(d.data.page){ }}", '<div class="layui-table-tool">', '<div class="layui-inline layui-table-page" id="layui-table-page{{d.index}}"></div>', "</div>", "{{# } }}", "<style>", "{{# layui.each(d.data.cols, function(i1, item1){", "layui.each(item1, function(i2, item2){ }}", ".laytable-cell-{{d.index}}-{{item2.field||i2}}{ width:{{item2.width||50}}px }", "{{# });", "}); }}", "</style>", "</div>"].join(""),
T = t(window),
S = t(document),
A = function(e) {
var i = this;
i.index = ++d.index, i.config = t.extend({}, i.config, d.config, e), i.render()
};
A.prototype.config = { limit: 30, loading: !0 }, A.prototype.render = function(e) {
var a, l = this;
if (e && (l.config = e), a = l.config, a.elem = t(a.elem), a.where = a.where || {}, a.request = t.extend({ pageName: "page", limitName: "limit" }, a.request), a.response = t.extend({ statusName: "code", statusCode: 0, msgName: "msg", dataName: "data", countName: "count" }, a.response), !a.elem[0]) return l;
var n = a.elem,
o = n.next("." + h);
a.height && /^full-\d+$/.test(a.height) && (l.fullHeightGap = a.height.split("-")[1], a.height = T.height() - l.fullHeightGap);
var r = l.elem = t(i(N).render({ VIEW_CLASS: h, data: a, index: l.index }));
if (a.index = l.index, o[0] && o.remove(), n.after(r), l.layHeader = r.find(y), l.layMain = r.find(m), l.layBody = r.find(p), l.layFixed = r.find(v), l.layFixLeft = r.find(g), l.layFixRight = r.find(x), l.layTool = r.find(b), a.height && l.fullSize(), a.cols.length > 1) {
var d = l.layFixed.find(y).find("th");
d.height(l.layHeader.height() - 1 - parseFloat(d.css("padding-top")) - parseFloat(d.css("padding-bottom")))
}
l.pullData(1), l.events()
}, A.prototype.reload = function(e) {
var i = this;
i.config = t.extend({}, i.config, e), i.render()
}, A.prototype.pullData = function(e, i) {
var a = this,
n = a.config,
o = n.request,
r = n.response,
d = function() { "object" == typeof n.initSort && a.sort(n.initSort.field, n.initSort.type, null, null, n.initSort.rule) };
if (n.url) {
var c = {};
c[o.pageName] = e, c[o.limitName] = n.limit, t.ajax({ type: n.method || "get", url: n.url, data: t.extend(c, n.where), dataType: "json", success: function(t) { return t[r.statusName] != r.statusCode ? (a.renderForm(), a.layMain.html('<div class="layui-none">' + (t[r.msgName] || "返回的数据状态异常") + "</div>")) : (a.renderData(t, e, t[r.countName]), d(), i && l.close(i), void("function" == typeof n.done && n.done(t, e, t[r.countName]))) }, error: function(e, t) { a.layMain.html('<div class="layui-none">数据接口请求异常</div>'), a.renderForm(), i && l.close(i) } })
} else if (n.data && n.data.constructor === Array) {
var s = {},
u = e * n.limit - n.limit;
s[r.dataName] = n.data.concat().splice(u, n.limit), s[r.countName] = n.data.length, a.renderData(s, e, n.data.length), d(), "function" == typeof n.done && n.done(s, e, s[r.countName])
}
}, A.prototype.page = 1, A.prototype.eachCols = function(e) { layui.each(this.config.cols, function(t, i) { layui.each(i, function(a, l) { e(a, l, [t, i]) }) }) }, A.prototype.renderData = function(e, n, o, r) {
var c = this,
s = c.config,
u = e[s.response.dataName] || [],
f = [],
h = [],
y = [],
p = function() {
return !r && c.sortKey ? c.sort(c.sortKey.field, c.sortKey.sort, !0) : (layui.each(u, function(e, a) {
var l = [],
n = [],
o = [];
0 !== a.length && (r || (a[d.config.indexName] = e), c.eachCols(function(e, r) {
var c = a[r.field || e];
if (void 0 !== c && null !== c || (c = ""), !(r.colspan > 1)) {
var u = ['<td data-field="' + (r.field || e) + '"' + function() { var e = []; return r.edit && e.push(' data-edit="true"'), r.align && e.push(' align="' + r.align + '"'), r.templet && e.push(' data-content="' + c + '"'), r.toolbar && e.push(' data-off="true"'), r.event && e.push(' lay-event="' + r.event + '"'), r.style && e.push(' style="' + r.style + '"'), e.join("") }() + ">", '<div class="layui-table-cell laytable-cell-' + function() { return r.checkbox ? "checkbox" : r.space ? "space" : s.index + "-" + (r.field || e) }() + '">' + function() { return r.checkbox ? '<input type="checkbox" name="layTableCheckbox" lay-skin="primary" ' + function() { var e = d.config.checkName; return r[e] ? (a[e] = r[e], r[e] ? "checked" : "") : a[e] ? "checked" : "" }() + ">" : r.toolbar ? i(t(r.toolbar).html() || "").render(a) : r.templet ? i(t(r.templet).html() || String(c)).render(a) : c }(), "</div></td>"].join("");
l.push(u), r.fixed && "right" !== r.fixed && n.push(u), "right" === r.fixed && o.push(u)
}
}), f.push('<tr data-index="' + e + '">' + l.join("") + "</tr>"), h.push('<tr data-index="' + e + '">' + n.join("") + "</tr>"), y.push('<tr data-index="' + e + '">' + o.join("") + "</tr>"))
}), c.layBody.scrollTop(0), c.layMain.find("tbody").html(f.join("")), c.layFixLeft.find("tbody").html(h.join("")), c.layFixRight.find("tbody").html(y.join("")), c.renderForm(), c.syncCheckAll(), c.haveInit ? c.scrollPatch() : setTimeout(function() { c.scrollPatch() }, 50), c.haveInit = !0, void l.close(c.tipsIndex))
};
return c.key = s.id || s.index, d.cache[c.key] = u, r ? p() : 0 === u.length ? (c.renderForm(), c.layFixed.remove(), c.layMain.html('<div class="layui-none">无数据</div>')) : (p(), void(s.page && (c.page = n, c.count = o, a.render({ elem: "layui-table-page" + s.index, count: o, groups: 3, limits: s.limits || [10, 20, 30, 40, 50, 60, 70, 80, 90], limit: s.limit, curr: n, layout: ["prev", "page", "next", "skip", "count", "limit"], prev: '<i class="layui-icon"></i>', next: '<i class="layui-icon"></i>', jump: function(e, t) { t || (c.page = e.curr, s.limit = e.limit, c.pullData(e.curr, c.loading())) } }), c.layTool.find(".layui-table-count span").html(o))))
},
A.prototype.renderForm = function(e) { n.render(e || "checkbox", "LAY-table-" + this.index) },
A.prototype.sort = function(e, i, a, n, z) {
var r, c, j, g, q, v, w, u = this,
f = u.config,
h = f.elem.attr("lay-filter"),
y = d.cache[u.key];
"string" == typeof e && u.layHeader.find("th").each(function(i, a) {
var l = t(this),
n = l.data("field");
if (n === e) return e = l, r = n, !1
});
try {
var r = r || e.data("field");
if (u.sortKey && !a && r === u.sortKey.field && i === u.sortKey.sort) return;
var p = u.layHeader.find("th .laytable-cell-" + f.index + "-" + r).find(k);
u.layHeader.find("th").find(k).removeAttr("lay-sort"), p.attr("lay-sort", i || null), u.layFixed.find("th")
} catch (m) {return o.error("Table modules: Did not match to field")}
u.sortKey = { field: r, sort: i, rule: z },
v = j = r || d.config.indexName, q = "desc" === i, w = 'tempSortNum', g = "function" === typeof z,
g ? function() { for (var x = 0; x < y.length; x++) { y[x][w] = z(y[x][j], x, y); } v = w }() : "",
c = layui.sort(y, v, q), q && delete u.sortKey,
g ? function() { for (var x = 0; x < y.length; x++) { delete y[x][w] } }() : "",
//"asc" === i ? c = layui.sort(y, r) : "desc" === i ? c = layui.sort(y, r, !0) : (c = layui.sort(y, d.config.indexName), delete u.sortKey),
u.renderData({ data: c }, u.page, u.count, !0),
l.close(u.tipsIndex),
n && layui.event.call(e, s, "sort(" + h + ")", { field: r, type: i })
}, A.prototype.loading = function() {
var e = this,
t = e.config;
if (t.loading && t.url) return l.msg("数据请求中", { icon: 16, offset: [e.elem.offset().top + e.elem.height() / 2 - 35 - T.scrollTop() + "px", e.elem.offset().left + e.elem.width() / 2 - 90 - T.scrollLeft() + "px"], anim: -1, fixed: !1 })
}, A.prototype.setCheckData = function(e, t) {
var i = this,
a = i.config,
l = d.cache[i.key];
l[e] && (l[e][a.checkName] = t)
}, A.prototype.syncCheckAll = function() {
var e = this,
t = e.config,
i = e.layHeader.find('input[name="layTableCheckbox"]'),
a = function(i) { return e.eachCols(function(e, a) { a.checkbox && (a[t.checkName] = i) }), i };
i[0] && (d.checkStatus(e.key).isAll ? (i[0].checked || (i.prop("checked", !0), e.renderForm()), a(!0)) : (i[0].checked && (i.prop("checked", !1), e.renderForm()), a(!1)))
}, A.prototype.getCssRule = function(e, t) {
var i = this,
a = i.elem.find("style")[0],
l = a.sheet || a.styleSheet,
n = l.cssRules || l.rules;
layui.each(n, function(a, l) { if (l.selectorText === ".laytable-cell-" + i.index + "-" + e) return t(l), !0 })
}, A.prototype.fullSize = function() {
var e, t = this,
i = t.config,
a = i.height;
t.fullHeightGap && (a = T.height() - t.fullHeightGap, a < 135 && (a = 135), t.elem.css("height", a)), e = parseFloat(a) - parseFloat(t.layHeader.height()) - 1, i.page && (e -= parseFloat(t.layTool.outerHeight() + 1)), t.layBody.css("height", e)
}, A.prototype.scrollPatch = function() {
var e = this,
i = e.layMain.children("table"),
a = e.layMain.width() - e.layMain.prop("clientWidth"),
l = e.layMain.height() - e.layMain.prop("clientHeight");
if (a && l) {
if (!e.elem.find(".layui-table-patch")[0]) {
var n = t('<th class="layui-table-patch"><div class="layui-table-cell"></div></th>');
n.find("div").css({ width: a }), e.layHeader.eq(0).find("thead tr").append(n)
}
} else e.layHeader.eq(0).find(".layui-table-patch").remove();
e.layFixed.find(p).css("height", e.layMain.height() - l), e.layFixRight[i.width() > e.layMain.width() ? "removeClass" : "addClass"](f), e.layFixRight.css("right", a - 1)
}, A.prototype.events = function() {
var e, a = this,
n = a.config,
o = t("body"),
c = {},
u = a.layHeader.find("th"),
f = ".layui-table-cell",
h = n.elem.attr("lay-filter"),
z = n.initSort.rule;
u.on("mousemove", function(e) {
var i = t(this),
a = i.offset().left,
l = e.clientX - a;
i.attr("colspan") > 1 || i.attr("unresize") || c.resizeStart || (c.allowResize = i.width() - l <= 10, o.css("cursor", c.allowResize ? "col-resize" : ""))
}).on("mouseleave", function() {
t(this);
c.resizeStart || o.css("cursor", "")
}).on("mousedown", function(e) {
if (c.allowResize) {
var i = t(this).data("field");
e.preventDefault(), c.resizeStart = !0, c.offset = [e.clientX, e.clientY], a.getCssRule(i, function(e) { c.rule = e, c.ruleWidth = parseFloat(e.style.width) })
}
}), S.on("mousemove", function(t) {
if (c.resizeStart) {
if (t.preventDefault(), c.rule) {
var i = c.ruleWidth + t.clientX - c.offset[0];
c.rule.style.width = i + "px", l.close(a.tipsIndex)
}
e = 1
}
}).on("mouseup", function(t) { c.resizeStart && (c = {}, o.css("cursor", ""), a.scrollPatch()), 2 === e && (e = null) }), u.on("click", function() {
var i, l = t(this),
n = l.find(k),
o = n.attr("lay-sort");
return n[0] && 1 !== e ? (i = "asc" === o ? "desc" : "desc" === o ? null : "asc", void a.sort(l, i, null, !0, z)) : e = 2
}).find(k + " .layui-edge ").on("click", function(e) {
var i = t(this),
l = i.index(),
n = i.parents("th").eq(0).data("field");
layui.stope(e), 0 === l ? a.sort(n, "asc", null, !0, z) : a.sort(n, "desc", null, !0, z)
}), a.elem.on("click", 'input[name="layTableCheckbox"]+', function() {
var e = t(this).prev(),
i = a.layBody.find('input[name="layTableCheckbox"]'),
l = e.parents("tr").eq(0).data("index"),
n = e[0].checked,
o = "layTableAllChoose" === e.attr("lay-filter");
o ? (i.each(function(e, t) { t.checked = n, a.setCheckData(e, n) }), a.syncCheckAll(), a.renderForm()) : (a.setCheckData(l, n), a.syncCheckAll()), layui.event.call(this, s, "checkbox(" + h + ")", { checked: n, data: d.cache[a.key][l], type: o ? "all" : "one" })
}), a.layBody.on("mouseenter", "tr", function() {
var e = t(this),
i = e.index();
a.layBody.find("tr:eq(" + i + ")").addClass(C)
}).on("mouseleave", "tr", function() {
var e = t(this),
i = e.index();
a.layBody.find("tr:eq(" + i + ")").removeClass(C)
}), a.layBody.on("change", "." + w, function() {
var e = t(this),
i = this.value,
l = e.parent().data("field"),
n = e.parents("tr").eq(0).data("index"),
o = d.cache[a.key][n];
o[l] = i, layui.event.call(this, s, "edit(" + h + ")", { value: i, data: o, field: l })
}).on("blur", "." + w, function() {
var e, l = t(this),
n = l.parent().data("field"),
o = l.parents("tr").eq(0).data("index"),
r = d.cache[a.key][o];
a.eachCols(function(t, i) { i.field == n && i.templet && (e = i.templet) }), l.siblings(f).html(e ? i(t(e).html() || this.value).render(r) : this.value), l.parent().data("content", this.value), l.remove()
}), a.layBody.on("click", "td", function() {
var e = t(this),
i = (e.data("field"), e.children(f));
if (!e.data("off")) { if (e.data("edit")) { var o = t('<input class="' + w + '">'); return o[0].value = e.data("content") || i.text(), e.find("." + w)[0] || e.append(o), o.focus() } i.prop("scrollWidth") > i.outerWidth() && (a.tipsIndex = l.tips(['<div class="layui-table-tips-main" style="margin-top: -' + (i.height() + 16) + "px;" + function() { return "sm" === n.size ? "padding: 4px 15px; font-size: 12px;" : "lg" === n.size ? "padding: 14px 15px;" : "" }() + '">', i.html(), "</div>", '<i class="layui-icon layui-table-tips-c">ဆ</i>'].join(""), i[0], { tips: [3, ""], time: -1, anim: -1, maxWidth: r.ios || r.android ? 300 : 600, isOutAnim: !1, skin: "layui-table-tips", success: function(e, t) { e.find(".layui-table-tips-c").on("click", function() { l.close(t) }) } })) }
}), a.layBody.on("click", "*[lay-event]", function() {
var e = t(this),
l = e.parents("tr").eq(0).data("index"),
n = a.layBody.find('tr[data-index="' + l + '"]'),
o = "layui-table-click",
r = d.cache[a.key][l];
layui.event.call(this, s, "tool(" + h + ")", {
data: d.clearCacheKey(r),
event: e.attr("lay-event"),
tr: n,
del: function() { d.cache[a.key][l] = [], n.remove(), a.scrollPatch() },
update: function(e) {
e = e || {}, layui.each(e, function(e, l) {
if (e in r) {
var o;
r[e] = l, a.eachCols(function(t, i) { i.field == e && i.templet && (o = i.templet) }), n.children('td[data-field="' + e + '"]').children(f).html(o ? i(t(o).html() || l).render(r) : l)
}
})
}
}), n.addClass(o).siblings("tr").removeClass(o)
}), a.layMain.on("scroll", function() {
var e = t(this),
i = e.scrollLeft(),
n = e.scrollTop();
a.layHeader.scrollLeft(i), a.layFixed.find(p).scrollTop(n), l.close(a.tipsIndex)
}), T.on("resize", function() { a.fullSize(), a.scrollPatch() })
}, d.init = function(e, i) {
i = i || {};
var a = this,
l = t(e ? 'table[lay-filter="' + e + '"]' : u + "[lay-data]"),
n = "Table element property lay-data configuration item has a syntax error: ";
return l.each(function() {
var a = t(this),
l = a.attr("lay-data");
try { l = new Function("return " + l)() } catch (r) { o.error(n + l) }
var c = [],
s = t.extend({ elem: this, cols: [], data: [], skin: a.attr("lay-skin"), size: a.attr("lay-size"), even: "string" == typeof a.attr("lay-even") }, d.config, i, l);
e && a.hide(), a.find("thead>tr").each(function(e) {
s.cols[e] = [], t(this).children().each(function(i) {
var a = t(this),
l = a.attr("lay-data");
try { l = new Function("return " + l)() } catch (r) { return o.error(n + l) }
var d = t.extend({ title: a.text(), colspan: a.attr("colspan"), rowspan: a.attr("rowspan") }, l);
c.push(d), s.cols[e].push(d)
})
}), a.find("tbody>tr").each(function(e) {
var i = t(this),
a = {};
i.children("td").each(function(e, i) {
var l = t(this),
n = l.data("field");
if (n) return a[n] = l.html()
}), layui.each(c, function(e, t) {
var l = i.children("td").eq(e);
a[t.field] = l.html()
}), s.data[e] = a
}), d.render(s)
}), a
}, d.checkStatus = function(e) {
var t = 0,
i = [],
a = d.cache[e];
return a ? (layui.each(a, function(e, a) { a[d.config.checkName] && (t++, i.push(d.clearCacheKey(a))) }), { data: i, isAll: t === a.length }) : {}
}, c.config = {}, d.reload = function(e, i) { var a = c.config[e]; return a ? d.render(t.extend({}, a, i)) : o.error("The ID option was not found in the table instance") }, d.render = function(e) { var t = new A(e); return c.call(t) }, d.clearCacheKey = function(e) { return e = t.extend({}, e), delete e[d.config.checkName], delete e[d.config.indexName], e }, d.init(), e(s, d)
});
2.1.2版本table.js修改前后的代码对比
layui2.2.5版本修改后的 table.js
/** layui-v2.2.5 MIT License By https://www.layui.com */ ;
layui.define(["laytpl", "laypage", "layer", "form"], function(e) {
"use strict";
var t = layui.$,
i = layui.laytpl,
a = layui.laypage,
l = layui.layer,
n = layui.form,
o = layui.hint(),
r = layui.device(),
d = { config: { checkName: "LAY_CHECKED", indexName: "LAY_TABLE_INDEX" }, cache: {}, index: layui.table ? layui.table.index + 1e4 : 0, set: function(e) { var i = this; return i.config = t.extend({}, i.config, e), i }, on: function(e, t) { return layui.onevent.call(this, s, e, t) } },
c = function() {
var e = this,
t = e.config,
i = t.id;
return i && (c.config[i] = t), { reload: function(t) { e.reload.call(e, t) }, config: t }
},
s = "table",
u = ".layui-table",
h = "layui-hide",
f = "layui-none",
y = "layui-table-view",
p = ".layui-table-header",
m = ".layui-table-body",
v = ".layui-table-main",
g = ".layui-table-fixed",
x = ".layui-table-fixed-l",
b = ".layui-table-fixed-r",
k = ".layui-table-tool",
C = ".layui-table-page",
w = ".layui-table-sort",
N = "layui-table-edit",
F = "layui-table-hover",
W = function(e) { var t = '{{#if(item2.colspan){}} colspan="{{item2.colspan}}"{{#} if(item2.rowspan){}} rowspan="{{item2.rowspan}}"{{#}}}'; return e = e || {}, ['<table cellspacing="0" cellpadding="0" border="0" class="layui-table" ', '{{# if(d.data.skin){ }}lay-skin="{{d.data.skin}}"{{# } }} {{# if(d.data.size){ }}lay-size="{{d.data.size}}"{{# } }} {{# if(d.data.even){ }}lay-even{{# } }}>', "<thead>", "{{# layui.each(d.data.cols, function(i1, item1){ }}", "<tr>", "{{# layui.each(item1, function(i2, item2){ }}", '{{# if(item2.fixed && item2.fixed !== "right"){ left = true; } }}', '{{# if(item2.fixed === "right"){ right = true; } }}', function() { return e.fixed && "right" !== e.fixed ? '{{# if(item2.fixed && item2.fixed !== "right"){ }}' : "right" === e.fixed ? '{{# if(item2.fixed === "right"){ }}' : "" }(), '<th data-field="{{ item2.field||i2 }}" {{# if(item2.minWidth){ }}data-minwidth="{{item2.minWidth}}"{{# } }} ' + t + ' {{# if(item2.unresize){ }}data-unresize="true"{{# } }}>', '<div class="layui-table-cell laytable-cell-', "{{# if(item2.colspan > 1){ }}", "group", "{{# } else { }}", "{{d.index}}-{{item2.field || i2}}", '{{# if(item2.type !== "normal"){ }}', " laytable-cell-{{ item2.type }}", "{{# } }}", "{{# } }}", '" {{#if(item2.align){}}align="{{item2.align}}"{{#}}}>', '{{# if(item2.type === "checkbox"){ }}', '<input type="checkbox" name="layTableCheckbox" lay-skin="primary" lay-filter="layTableAllChoose" {{# if(item2[d.data.checkName]){ }}checked{{# }; }}>', "{{# } else { }}", '<span>{{item2.title||""}}</span>', "{{# if(!(item2.colspan > 1) && item2.sort){ }}", '<span class="layui-table-sort layui-inline"><i class="layui-edge layui-table-sort-asc"></i><i class="layui-edge layui-table-sort-desc"></i></span>', "{{# } }}", "{{# } }}", "</div>", "</th>", e.fixed ? "{{# }; }}" : "", "{{# }); }}", "</tr>", "{{# }); }}", "</thead>", "</table>"].join("") },
z = ['<table cellspacing="0" cellpadding="0" border="0" class="layui-table" ', '{{# if(d.data.skin){ }}lay-skin="{{d.data.skin}}"{{# } }} {{# if(d.data.size){ }}lay-size="{{d.data.size}}"{{# } }} {{# if(d.data.even){ }}lay-even{{# } }}>', "<tbody></tbody>", "</table>"].join(""),
A = ['<div class="layui-form layui-border-box {{d.VIEW_CLASS}}" lay-filter="LAY-table-{{d.index}}" style="{{# if(d.data.width){ }}width:{{d.data.width}}px;{{# } }} {{# if(d.data.height){ }}height:{{d.data.height}}px;{{# } }}">', "{{# if(d.data.toolbar){ }}", '<div class="layui-table-tool"></div>', "{{# } }}", '<div class="layui-table-box">', "{{# var left, right; }}", '<div class="layui-table-header">', W(), "</div>", '<div class="layui-table-body layui-table-main">', z, "</div>", "{{# if(left){ }}", '<div class="layui-table-fixed layui-table-fixed-l">', '<div class="layui-table-header">', W({ fixed: !0 }), "</div>", '<div class="layui-table-body">', z, "</div>", "</div>", "{{# }; }}", "{{# if(right){ }}", '<div class="layui-table-fixed layui-table-fixed-r">', '<div class="layui-table-header">', W({ fixed: "right" }), '<div class="layui-table-mend"></div>', "</div>", '<div class="layui-table-body">', z, "</div>", "</div>", "{{# }; }}", "</div>", "{{# if(d.data.page){ }}", '<div class="layui-table-page">', '<div id="layui-table-page{{d.index}}"></div>', "</div>", "{{# } }}", "<style>", "{{# layui.each(d.data.cols, function(i1, item1){", "layui.each(item1, function(i2, item2){ }}", ".laytable-cell-{{d.index}}-{{item2.field||i2}}{ ", "{{# if(item2.width){ }}", "width: {{item2.width}}px;", "{{# } }}", " }", "{{# });", "}); }}", "</style>", "</div>"].join(""),
T = t(window),
M = t(document),
S = function(e) {
var i = this;
i.index = ++d.index, i.config = t.extend({}, i.config, d.config, e), i.render()
};
S.prototype.config = { limit: 10, loading: !0, cellMinWidth: 60, text: { none: "无数据" } }, S.prototype.render = function() {
var e = this,
a = e.config;
if (a.elem = t(a.elem), a.where = a.where || {}, a.id = a.id || a.elem.attr("id"), a.request = t.extend({ pageName: "page", limitName: "limit" }, a.request), a.response = t.extend({ statusName: "code", statusCode: 0, msgName: "msg", dataName: "data", countName: "count" }, a.response), "object" == typeof a.page && (a.limit = a.page.limit || a.limit, a.limits = a.page.limits || a.limits, e.page = a.page.curr = a.page.curr || 1, delete a.page.elem, delete a.page.jump), !a.elem[0]) return e;
e.setArea();
var l = a.elem,
n = l.next("." + y),
o = e.elem = t(i(A).render({ VIEW_CLASS: y, data: a, index: e.index }));
if (a.index = e.index, n[0] && n.remove(), l.after(o), e.layHeader = o.find(p), e.layMain = o.find(v), e.layBody = o.find(m), e.layFixed = o.find(g), e.layFixLeft = o.find(x), e.layFixRight = o.find(b), e.layTool = o.find(k), e.layPage = o.find(C), e.layTool.html(i(t(a.toolbar).html() || "").render(a)), a.height && e.fullSize(), a.cols.length > 1) {
var r = e.layFixed.find(p).find("th");
r.height(e.layHeader.height() - 1 - parseFloat(r.css("padding-top")) - parseFloat(r.css("padding-bottom")))
}
e.pullData(e.page), e.events()
}, S.prototype.initOpts = function(e) {
var t = this,
i = (t.config, { checkbox: 48, space: 15, numbers: 40 });
e.checkbox && (e.type = "checkbox"), e.space && (e.type = "space"), e.type || (e.type = "normal"), "normal" !== e.type && (e.unresize = !0, e.width = e.width || i[e.type])
}, S.prototype.setArea = function() {
var e = this,
t = e.config,
i = 0,
a = 0,
l = 0,
n = 0,
o = t.width || function() {
var e = function(i) {
var a, l;
i = i || t.elem.parent(), a = i.width();
try { l = "none" === i.css("display") } catch (n) {}
return !i[0] || a && !l ? a : e(i.parent())
};
return e()
}();
e.eachCols(function() { i++ }), o -= function() { return "line" === t.skin || "nob" === t.skin ? 2 : i + 1 }(), layui.each(t.cols, function(t, i) { layui.each(i, function(t, l) { var r; return l ? (e.initOpts(l), r = l.width || 0, void(l.colspan > 1 || (/\d+%$/.test(r) ? l.width = r = Math.floor(parseFloat(r) / 100 * o) : r || (l.width = r = 0, a++), n += r))) : void i.splice(t, 1) }) }), e.autoColNums = a, o > n && a && (l = (o - n) / a), layui.each(t.cols, function(e, i) {
layui.each(i, function(e, i) {
var a = i.minWidth || t.cellMinWidth;
i.colspan > 1 || 0 === i.width && (i.width = Math.floor(l >= a ? l : a))
})
}), t.height && /^full-\d+$/.test(t.height) && (e.fullHeightGap = t.height.split("-")[1], t.height = T.height() - e.fullHeightGap)
}, S.prototype.reload = function(e) {
var i = this;
i.config.data && i.config.data.constructor === Array && delete i.config.data, i.config = t.extend({}, i.config, e), i.render()
}, S.prototype.page = 1, S.prototype.pullData = function(e, i) {
var a = this,
n = a.config,
o = n.request,
r = n.response,
d = function() { "object" == typeof n.initSort && a.sort(n.initSort.field, n.initSort.type, null, null, n.initSort.rule) };
if (a.startTime = (new Date).getTime(), n.url) {
var c = {};
c[o.pageName] = e, c[o.limitName] = n.limit, t.ajax({ type: n.method || "get", url: n.url, data: t.extend(c, n.where), dataType: "json", success: function(t) { t[r.statusName] != r.statusCode ? (a.renderForm(), a.layMain.html('<div class="' + f + '">' + (t[r.msgName] || "返回的数据状态异常") + "</div>")) : (a.renderData(t, e, t[r.countName]), d(), n.time = (new Date).getTime() - a.startTime + " ms"), i && l.close(i), "function" == typeof n.done && n.done(t, e, t[r.countName]) }, error: function(e, t) { a.layMain.html('<div class="' + f + '">数据接口请求异常</div>'), a.renderForm(), i && l.close(i) } })
} else if (n.data && n.data.constructor === Array) {
var s = {},
u = e * n.limit - n.limit;
s[r.dataName] = n.data.concat().splice(u, n.limit), s[r.countName] = n.data.length, a.renderData(s, e, n.data.length), d(), "function" == typeof n.done && n.done(s, e, s[r.countName])
}
}, S.prototype.eachCols = function(e) {
var i = t.extend(!0, [], this.config.cols),
a = [],
l = 0;
layui.each(i, function(e, t) {
layui.each(t, function(t, n) {
if (n.colspan > 1) {
var o = 0;
l++, n.CHILD_COLS = [], layui.each(i[e + 1], function(e, t) { t.PARENT_COL || o == n.colspan || (t.PARENT_COL = l, n.CHILD_COLS.push(t), o += t.colspan > 1 ? t.colspan : 1) })
}
n.PARENT_COL || a.push(n)
})
});
var n = function(t) { layui.each(t || a, function(t, i) { return i.CHILD_COLS ? n(i.CHILD_COLS) : void e(t, i) }) };
n()
}, S.prototype.renderData = function(e, n, o, r) {
var c = this,
s = c.config,
u = e[s.response.dataName] || [],
y = [],
p = [],
m = [],
v = function() {
return !r && c.sortKey ? c.sort(c.sortKey.field, c.sortKey.sort, !0) : (layui.each(u, function(e, a) {
var l = [],
o = [],
u = [],
h = e + s.limit * (n - 1) + 1;
0 !== a.length && (r || (a[d.config.indexName] = e), c.eachCols(function(e, n) {
var r = n.field || e,
f = a[r];
c.getColElem(c.layHeader, r);
if (void 0 !== f && null !== f || (f = ""), !(n.colspan > 1)) {
var y = ['<td data-field="' + r + '" ' + function() { var e = []; return n.edit && e.push('data-edit="' + n.edit + '"'), n.align && e.push('align="' + n.align + '"'), n.templet && e.push('data-content="' + f + '"'), n.toolbar && e.push('data-off="true"'), n.event && e.push('lay-event="' + n.event + '"'), n.style && e.push('style="' + n.style + '"'), n.minWidth && e.push('data-minwidth="' + n.minWidth + '"'), e.join(" ") }() + ">", '<div class="layui-table-cell laytable-cell-' + function() { var e = s.index + "-" + r; return "normal" === n.type ? e : e + " laytable-cell-" + n.type }() + '">' + function() { var e = t.extend(!0, { LAY_INDEX: h }, a); return "checkbox" === n.type ? '<input type="checkbox" name="layTableCheckbox" lay-skin="primary" ' + function() { var t = d.config.checkName; return n[t] ? (a[t] = n[t], n[t] ? "checked" : "") : e[t] ? "checked" : "" }() + ">" : "numbers" === n.type ? h : n.toolbar ? i(t(n.toolbar).html() || "").render(e) : n.templet ? function() { return "function" == typeof n.templet ? n.templet(e) : i(t(n.templet).html() || String(f)).render(e) }() : f }(), "</div></td>"].join("");
l.push(y), n.fixed && "right" !== n.fixed && o.push(y), "right" === n.fixed && u.push(y)
}
}), y.push('<tr data-index="' + e + '">' + l.join("") + "</tr>"), p.push('<tr data-index="' + e + '">' + o.join("") + "</tr>"), m.push('<tr data-index="' + e + '">' + u.join("") + "</tr>"))
}), c.layBody.scrollTop(0), c.layMain.find("." + f).remove(), c.layMain.find("tbody").html(y.join("")), c.layFixLeft.find("tbody").html(p.join("")), c.layFixRight.find("tbody").html(m.join("")), c.renderForm(), c.syncCheckAll(), c.haveInit ? c.scrollPatch() : setTimeout(function() { c.scrollPatch() }, 50), c.haveInit = !0, void l.close(c.tipsIndex))
};
return c.key = s.id || s.index, d.cache[c.key] = u, c.layPage[0 === u.length && 1 == n ? "addClass" : "removeClass"](h), r ? v() : 0 === u.length ? (c.renderForm(), c.layFixed.remove(), c.layMain.find("tbody").html(""), c.layMain.find("." + f).remove(), c.layMain.append('<div class="' + f + '">' + s.text.none + "</div>")) : (v(), void(s.page && (s.page = t.extend({ elem: "layui-table-page" + s.index, count: o, limit: s.limit, limits: s.limits || [10, 20, 30, 40, 50, 60, 70, 80, 90], groups: 3, layout: ["prev", "page", "next", "skip", "count", "limit"], prev: '<i class="layui-icon"></i>', next: '<i class="layui-icon"></i>', jump: function(e, t) { t || (c.page = e.curr, s.limit = e.limit, c.pullData(e.curr, c.loading())) } }, s.page), s.page.count = o, a.render(s.page))))
}, S.prototype.getColElem = function(e, t) {
var i = this,
a = i.config;
return e.eq(0).find(".laytable-cell-" + (a.index + "-" + t) + ":eq(0)")
}, S.prototype.renderForm = function(e) { n.render(e, "LAY-table-" + this.index) },
S.prototype.sort = function(e, i, a, l, z) {
var n, r, j, g, q, v, b, c = this,
u = {},
h = c.config,
f = h.elem.attr("lay-filter"),
y = d.cache[c.key];
"string" == typeof e && c.layHeader.find("th").each(function(i, a) {
var l = t(this),
o = l.data("field");
if (o === e) return e = l, n = o, !1
});
try {
var n = n || e.data("field");
if (c.sortKey && !a && n === c.sortKey.field && i === c.sortKey.sort) return;
var p = c.layHeader.find("th .laytable-cell-" + h.index + "-" + n).find(w);
c.layHeader.find("th").find(w).removeAttr("lay-sort"), p.attr("lay-sort", i || null), c.layFixed.find("th")
} catch (m) { return o.error("Table modules: Did not match to field") }
c.sortKey = { field: n, sort: i, rule: z },
v = j = n || d.config.indexName, q = "desc" === i, b = 'tempSortNum', g = "function" === typeof z,
g ? function() { for (var x = 0; x < y.length; x++) { y[x][b] = z(y[x][j], x, y); } v = b }() : "",
r = layui.sort(y, v, q), q && delete c.sortKey,
g ? function() { for (var x = 0; x < y.length; x++) { delete y[x][b] } }() : "",
//"asc" === i ? r = layui.sort(y, n) : "desc" === i ? r = layui.sort(y, n, !0) : (r = layui.sort(y, d.config.indexName), delete c.sortKey), u[h.response.dataName] = r, c.renderData(u, c.page, c.count, !0), l && layui.event.call(e, s, "sort(" + f + ")", { field: n, type: i }),
u[h.response.dataName] = r,
//c.renderData({ data: c }, u.page, u.count, !0),
c.renderData(u, c.page, c.count, !0),
l && layui.event.call(e, s, "sort(" + f + ")", { field: n, type: i });
}, S.prototype.loading = function() {
var e = this,
t = e.config;
if (t.loading && t.url) return l.msg("数据请求中", { icon: 16, offset: [e.elem.offset().top + e.elem.height() / 2 - 35 - T.scrollTop() + "px", e.elem.offset().left + e.elem.width() / 2 - 90 - T.scrollLeft() + "px"], time: -1, anim: -1, fixed: !1 })
}, S.prototype.setCheckData = function(e, t) {
var i = this,
a = i.config,
l = d.cache[i.key];
l[e] && l[e].constructor !== Array && (l[e][a.checkName] = t)
}, S.prototype.syncCheckAll = function() {
var e = this,
t = e.config,
i = e.layHeader.find('input[name="layTableCheckbox"]'),
a = function(i) { return e.eachCols(function(e, a) { "checkbox" === a.type && (a[t.checkName] = i) }), i };
i[0] && (d.checkStatus(e.key).isAll ? (i[0].checked || (i.prop("checked", !0), e.renderForm("checkbox")), a(!0)) : (i[0].checked && (i.prop("checked", !1), e.renderForm("checkbox")), a(!1)))
}, S.prototype.getCssRule = function(e, t) {
var i = this,
a = i.elem.find("style")[0],
l = a.sheet || a.styleSheet || {},
n = l.cssRules || l.rules;
layui.each(n, function(a, l) { if (l.selectorText === ".laytable-cell-" + i.index + "-" + e) return t(l), !0 })
}, S.prototype.fullSize = function() {
var e, t = this,
i = t.config,
a = i.height;
t.fullHeightGap && (a = T.height() - t.fullHeightGap, a < 135 && (a = 135), t.elem.css("height", a)), e = parseFloat(a) - parseFloat(t.layHeader.height()) - 1, i.toolbar && (e -= t.layTool.outerHeight()), i.page && (e = e - t.layPage.outerHeight() - 1), t.layMain.css("height", e)
}, S.prototype.getScrollWidth = function(e) { var t = 0; return e ? t = e.offsetWidth - e.clientWidth : (e = document.createElement("div"), e.style.width = "100px", e.style.height = "100px", e.style.overflowY = "scroll", document.body.appendChild(e), t = e.offsetWidth - e.clientWidth, document.body.removeChild(e)), t }, S.prototype.scrollPatch = function() {
var e = this,
i = e.layMain.children("table"),
a = e.layMain.width() - e.layMain.prop("clientWidth"),
l = e.layMain.height() - e.layMain.prop("clientHeight"),
n = e.getScrollWidth(e.layMain[0]),
o = i.outerWidth() - e.layMain.width();
if (e.autoColNums && o < 5 && !e.scrollPatchWStatus) {
var r = e.layHeader.eq(0).find("thead th:last-child"),
d = r.data("field");
e.getCssRule(d, function(t) {
var i = t.style.width || r.outerWidth();
t.style.width = parseFloat(i) - n - o + "px", e.layMain.height() - e.layMain.prop("clientHeight") > 0 && (t.style.width = parseFloat(t.style.width) - 1 + "px"), e.scrollPatchWStatus = !0
})
}
if (a && l) {
if (!e.elem.find(".layui-table-patch")[0]) {
var c = t('<th class="layui-table-patch"><div class="layui-table-cell"></div></th>');
c.find("div").css({ width: a }), e.layHeader.eq(0).find("thead tr").append(c)
}
} else e.layHeader.eq(0).find(".layui-table-patch").remove();
var s = e.layMain.height(),
u = s - l;
e.layFixed.find(m).css("height", i.height() > u ? u : "auto"), e.layFixRight[o > 0 ? "removeClass" : "addClass"](h), e.layFixRight.css("right", a - 1)
}, S.prototype.events = function() {
var e, a = this,
n = a.config,
o = t("body"),
c = {},
u = a.layHeader.find("th"),
h = ".layui-table-cell",
f = n.elem.attr("lay-filter");
z = n.initSort.rule;
u.on("mousemove", function(e) {
var i = t(this),
a = i.offset().left,
l = e.clientX - a;
i.attr("colspan") > 1 || i.data("unresize") || c.resizeStart || (c.allowResize = i.width() - l <= 10, o.css("cursor", c.allowResize ? "col-resize" : ""))
}).on("mouseleave", function() {
t(this);
c.resizeStart || o.css("cursor", "")
}).on("mousedown", function(e) {
var i = t(this);
if (c.allowResize) {
var l = i.data("field");
e.preventDefault(), c.resizeStart = !0, c.offset = [e.clientX, e.clientY], a.getCssRule(l, function(e) {
var t = e.style.width || i.outerWidth();
c.rule = e, c.ruleWidth = parseFloat(t), c.minWidth = i.data("minwidth") || n.cellMinWidth
})
}
}), M.on("mousemove", function(t) {
if (c.resizeStart) {
if (t.preventDefault(), c.rule) {
var i = c.ruleWidth + t.clientX - c.offset[0];
i < c.minWidth && (i = c.minWidth), c.rule.style.width = i + "px", l.close(a.tipsIndex)
}
e = 1
}
}).on("mouseup", function(t) { c.resizeStart && (c = {}, o.css("cursor", ""), a.scrollPatch()), 2 === e && (e = null) }), u.on("click", function() {
var i, l = t(this),
n = l.find(w),
o = n.attr("lay-sort");
return n[0] && 1 !== e ? (i = "asc" === o ? "desc" : "desc" === o ? null : "asc", void a.sort(l, i, null, !0, z)) : e = 2
}).find(w + " .layui-edge ").on("click", function(e) {
var i = t(this),
l = i.index(),
n = i.parents("th").eq(0).data("field");
layui.stope(e), 0 === l ? a.sort(n, "asc", null, !0, z) : a.sort(n, "desc", null, !0, z)
}), a.elem.on("click", 'input[name="layTableCheckbox"]+', function() {
var e = t(this).prev(),
i = a.layBody.find('input[name="layTableCheckbox"]'),
l = e.parents("tr").eq(0).data("index"),
n = e[0].checked,
o = "layTableAllChoose" === e.attr("lay-filter");
o ? (i.each(function(e, t) { t.checked = n, a.setCheckData(e, n) }), a.syncCheckAll(), a.renderForm("checkbox")) : (a.setCheckData(l, n), a.syncCheckAll()), layui.event.call(this, s, "checkbox(" + f + ")", { checked: n, data: d.cache[a.key] ? d.cache[a.key][l] || {} : {}, type: o ? "all" : "one" })
}), a.layBody.on("mouseenter", "tr", function() {
var e = t(this),
i = e.index();
a.layBody.find("tr:eq(" + i + ")").addClass(F)
}).on("mouseleave", "tr", function() {
var e = t(this),
i = e.index();
a.layBody.find("tr:eq(" + i + ")").removeClass(F)
}), a.layBody.on("change", "." + N, function() {
var e = t(this),
i = this.value,
l = e.parent().data("field"),
n = e.parents("tr").eq(0).data("index"),
o = d.cache[a.key][n];
o[l] = i, layui.event.call(this, s, "edit(" + f + ")", { value: i, data: o, field: l })
}).on("blur", "." + N, function() {
var e, l = t(this),
n = l.parent().data("field"),
o = l.parents("tr").eq(0).data("index"),
r = d.cache[a.key][o];
a.eachCols(function(t, i) { i.field == n && i.templet && (e = i.templet) }), l.siblings(h).html(e ? i(t(e).html() || this.value).render(r) : this.value), l.parent().data("content", this.value), l.remove()
}), a.layBody.on("click", "td", function() {
var e = t(this),
i = (e.data("field"), e.data("edit")),
o = e.children(h);
if (l.close(a.tipsIndex), !e.data("off"))
if (i)
if ("select" === i);
else {
var d = t('<input class="layui-input ' + N + '">');
d[0].value = e.data("content") || o.text(), e.find("." + N)[0] || e.append(d), d.focus()
}
else o.find(".layui-form-switch,.layui-form-checkbox")[0] || Math.round(o.prop("scrollWidth")) > Math.round(o.outerWidth()) && (a.tipsIndex = l.tips(['<div class="layui-table-tips-main" style="margin-top: -' + (o.height() + 16) + "px;" + function() { return "sm" === n.size ? "padding: 4px 15px; font-size: 12px;" : "lg" === n.size ? "padding: 14px 15px;" : "" }() + '">', o.html(), "</div>", '<i class="layui-icon layui-table-tips-c">ဆ</i>'].join(""), o[0], { tips: [3, ""], time: -1, anim: -1, maxWidth: r.ios || r.android ? 300 : 600, isOutAnim: !1, skin: "layui-table-tips", success: function(e, t) { e.find(".layui-table-tips-c").on("click", function() { l.close(t) }) } }))
}), a.layBody.on("click", "*[lay-event]", function() {
var e = t(this),
l = e.parents("tr").eq(0).data("index"),
n = a.layBody.find('tr[data-index="' + l + '"]'),
o = "layui-table-click",
r = d.cache[a.key][l];
layui.event.call(this, s, "tool(" + f + ")", {
data: d.clearCacheKey(r),
event: e.attr("lay-event"),
tr: n,
del: function() { d.cache[a.key][l] = [], n.remove(), a.scrollPatch() },
update: function(e) {
e = e || {}, layui.each(e, function(e, l) {
if (e in r) {
var o, d = n.children('td[data-field="' + e + '"]');
r[e] = l, a.eachCols(function(t, i) { i.field == e && i.templet && (o = i.templet) }), d.children(h).html(o ? i(t(o).html() || l).render(r) : l), d.data("content", l)
}
})
}
}), n.addClass(o).siblings("tr").removeClass(o)
}), a.layMain.on("scroll", function() {
var e = t(this),
i = e.scrollLeft(),
n = e.scrollTop();
a.layHeader.scrollLeft(i), a.layFixed.find(m).scrollTop(n), l.close(a.tipsIndex)
}), T.on("resize", function() { a.fullSize(), a.scrollPatch() })
}, d.init = function(e, i) {
i = i || {};
var a = this,
l = t(e ? 'table[lay-filter="' + e + '"]' : u + "[lay-data]"),
n = "Table element property lay-data configuration item has a syntax error: ";
return l.each(function() {
var a = t(this),
l = a.attr("lay-data");
try { l = new Function("return " + l)() } catch (r) { o.error(n + l) }
var c = [],
s = t.extend({ elem: this, cols: [], data: [], skin: a.attr("lay-skin"), size: a.attr("lay-size"), even: "string" == typeof a.attr("lay-even") }, d.config, i, l);
e && a.hide(), a.find("thead>tr").each(function(e) {
s.cols[e] = [], t(this).children().each(function(i) {
var a = t(this),
l = a.attr("lay-data");
try { l = new Function("return " + l)() } catch (r) { return o.error(n + l) }
var d = t.extend({ title: a.text(), colspan: a.attr("colspan") || 0, rowspan: a.attr("rowspan") || 0 }, l);
d.colspan < 2 && c.push(d), s.cols[e].push(d)
})
}), a.find("tbody>tr").each(function(e) {
var i = t(this),
a = {};
i.children("td").each(function(e, i) {
var l = t(this),
n = l.data("field");
if (n) return a[n] = l.html()
}), layui.each(c, function(e, t) {
var l = i.children("td").eq(e);
a[t.field] = l.html()
}), s.data[e] = a
}), d.render(s)
}), a
}, d.checkStatus = function(e) {
var t = 0,
i = 0,
a = [],
l = d.cache[e] || [];
return layui.each(l, function(e, l) { return l.constructor === Array ? void i++ : void(l[d.config.checkName] && (t++, a.push(d.clearCacheKey(l)))) }), { data: a, isAll: !!l.length && t === l.length - i }
}, c.config = {}, d.reload = function(e, i) { var a = c.config[e]; return i = i || {}, a ? (i.data && i.data.constructor === Array && delete a.data, d.render(t.extend(!0, {}, a, i))) : o.error("The ID option was not found in the table instance") }, d.render = function(e) { var t = new S(e); return c.call(t) }, d.clearCacheKey = function(e) { return e = t.extend({}, e), delete e[d.config.checkName], delete e[d.config.indexName], e }, d.init(), e(s, d)
});
2.2.5版本table.js修改前后的代码对比