文件上传篇：
文件上传模版
uploadK.render({
elem: '#dimissioCertificate' //绑定元素
, url: ctx + '/editWorkExperience' //上传接口
, field: 'dimissioCertificate'
, auto: false
, bindAction: '#submitButton' //指向一个按钮触发上传
, accept: 'images'
, acceptMime: 'image/*'
, exts: 'jpg|png|gif|bmp|jpeg'
, before: function (obj) {
if(layui.form.verifyForm("editForm")){
this.data=formToJson($('#editForm').serializeArray());
if (checkDeviceK().ie <= 9) {
var data_IE = this.data;
for (var i in data_IE) {
var info = typeof(data_IE[i]) === "function" ? data_IE[i]() : data_IE[i];
$('.layui-upload-form').append('<input type="hidden" name="' + i + '" value="' + info + '">')
}
}
}else {
return false;
}
}
, progress: function (n, elem) {
}
, done: function (res, index, upload) {
layerK.closeAll('loading'); //关闭loading
if(res.status>0){
parent.timeOut("保存成功！");
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭
}
//上传完毕回调
}
, error: function (index, upload) {
//请求异常回调
layerK.closeAll('loading'); //关闭loading
}
});修改layui.each(o, function (e, o) {｝解决上传文件未选择时也能提交表单内的其他数据；
var lengthComputable=true;r.prototype.lengthComputableK = function () {
return lengthComputable;
}r.prototype.eachK = function (e, t) {
/**/
var n, r = this;
if ("function" != typeof t) return r;
if (e = e || [], e.constructor === Object) {
for (n in e) {
if (t.call(e[n], n, e[n])) {
break
}
}
} else if (e = e || [], e.constructor == FileList) {
lengthComputable=false;
t.call(null, null, null)
} else for (n = 0; n < e.length && !t.call(e[n], n, e[n]); n++) ;
return r
}, p.prototype.upload = function (e, i) {
var n, a = this, l = a.config, r = a.elemFile[0], u = function () {
var i = 0, n = 0, o = e || a.files || a.chooseFiles || r.files, u = function () {
l.multiple && i + n === a.fileLength && "function" == typeof l.allDone && l.allDone({
total: a.fileLength,
successful: i,
aborted: n
})
};
layui.eachK(o, function (e, o) {
var r = new FormData;
r.append(l.field, o), layui.each(l.data, function (e, t) {
t = "function" == typeof t ? t() : t, r.append(e, t)
});
var c = {
url: l.url,
type: "post",
data: r,
contentType: !1,
processData: !1,
dataType: "json",
headers: l.headers || {},
success: function (t) {
i++, d(e, t), u()
},
error: function () {
n++, a.msg("请求上传接口出现异常"), m(e), u()
}
};
"function" == typeof l.progress && (c.xhr = function () {
var e = t.ajaxSettings.xhr();
return e.upload.addEventListener("progress", function (e) {
if (e.lengthComputable&&layui.lengthComputableK()) {
var t = Math.floor(e.loaded / e.total * 100);
l.progress(t, l.item[0], e)
}
}), e
}), t.ajax(c)
})
}, r.prototype.eachK = function (e, t) {
var n, r = this;
if ("function" != typeof t) return r;
if (e = e || [], e.constructor === Object) {
for (n in e){
if (t.call(e[n], n, e[n])){
break
}
}
}else if(e = e || [], e.constructor==FileList){
//e.lengthComputable=false;
t.call(null, null, null)
}
else for (n = 0; n < e.length && !t.call(e[n], n, e[n]); n++) ;
return r
},修改if (v = 0 === v.length ? r.value.match(/[^\/\\]+\..+/g) || [] || "" : v) {｝解决未选择上传文件时before方法不执行，（在before函数内可以进行数据验证）；
if (v = 0 === v.length ? r.value.match(/[^\/\\]+\..+/g) || [] || "" : v) {
switch (l.accept) {
case"file":
if (h && !RegExp("\\w\\.(" + h + ")$", "i").test(escape(v))) return a.msg("选择的文件中包含不支持的格式"), r.value = "";
break;
case"video":
if (!RegExp("\\w\\.(" + (h || "avi|mp4|wma|rmvb|rm|flash|3gp|flv") + ")$", "i").test(escape(v))) return a.msg("选择的视频中包含不支持的格式"), r.value = "";
break;
case"audio":
if (!RegExp("\\w\\.(" + (h || "mp3|wav|mid") + ")$", "i").test(escape(v))) return a.msg("选择的音频中包含不支持的格式"), r.value = "";
break;
default:
if (layui.each(v, function (e, t) {
RegExp("\\w\\.(" + (h || "jpg|png|gif|bmp|jpeg$") + ")", "i").test(escape(t)) || (n = !0)
}), n) return a.msg("选择的图片中包含不支持的格式"), r.value = ""
}修改 if ("choose" !== i && !l.auto || (l.choose && l.choose(g), "choose" !== i)) {｝里面的内容，可以在before函数内使用return false；进行终止上传动作；
y = function () {
if ("choose" !== i && !l.auto || (l.choose && l.choose(g), "choose" !== i)) {
//ie8>c();c()是form.submit();
if (o.ie === false) {
return (l.before && l.before(g)) == false ? '' : void u();
} else if (o.ie > 9) {
return (l.before && l.before(g)) == false ? '' : u();
} else {
return (l.before && l.before(g)) == false ? '' : c();
}
/*
return (l.before && l.before(g))==false? '' : o.ie ? o.ie > 9 ? u() : c() : void u()
*/
}
};form表单篇：
增加主动调用表单验证（更新上传文件非空验证颜色改变）(兼容了ie8，9，10)
优化上传文件按钮选择文件状态颜色提示
.layui-file-danger:hover {
background-color: #FF5722 !important
}
.layui-file-danger:focus {
background-color: #FF5722 !important
}u.prototype.verifyForm = function (formId) {
var e = null, a = f.config.verify, s = "layui-form-danger", s1 = "layui-file-danger", c = t("#" + formId),
deviceK = (layui.hint(), layui.device()), d = c.find("*[lay-verify]");
layui.each(d, function (l, r) {
var o = t(this), c = o.attr("lay-verify").split("|"), u = o.attr("lay-verType"), d = o.val();
if (o.attr("type") == "file" ? (deviceK.ie && deviceK.ie <= 9 ? o.parent().prev().removeClass(s1) : o.prev().removeClass(s1)) : o.removeClass(s), layui.each(c, function (t, l) {
var c, f = "", v = "function" == typeof a[l];
if (a[l]) {
var c = v ? f = a[l](d, r) : !a[l][0].test(d);
if (f = f || a[l][1], "required" === l && (f = o.attr("lay-reqText") || f), c) {
return "tips" === u ? i.tips(f, function () {
return "string" == typeof o.attr("lay-ignore") || "select" !== r.tagName.toLowerCase() && !/^checkbox|radio$/.test(r.type) ? o : o.next()
}(), {tips: 1}) : "alert" === u ? i.alert(f, {title: "提示", shadeClose: !0}) : i.msg(f, {
icon: 2,
shift: 6
}), n.android || n.ios || setTimeout(function () {
if(r.type == "file"){
if(deviceK.ie && deviceK.ie <= 9){
o.parent().prev().focus();
}else {
o.prev().focus();
}
}else {
r.focus()
}
}, 7), o.attr("type") == "file" ? (deviceK.ie && deviceK.ie <= 9 ? o.parent().prev().addClass(s1) : o.prev().addClass(s1)) : o.addClass(s), e = !0
}
}
}), e) {
return e
}
});
return !e
}原版：
.layui-form-danger + .layui-form-select .layui-input, .layui-form-danger:focus {
border-color: #FF5722 !important
}
替换为如下(解决下拉框验证一直红框的问题)：
.layui-form-danger + .layui-form-select .layui-input:focus, .layui-form-danger:focus {
border-color: #FF5722 !important
}优化表单验证逻辑，当没有required有其他number、phone验证时，字符串为空不进行required验证以及其他验证，当有值时进行number、phone以及其他验证；
var d = function () {
var e = null, a = f.config.verify, o = "layui-form-danger", s = {}, c = t(this), u = c.parents(r).eq(0),
d = u.find("*[lay-verify]"), h = c.parents("form")[0], y = c.attr("lay-filter");
return layui.each(d, function (l, r) {
var s = t(this), c = s.attr("lay-verify").split("|"), u = s.attr("lay-verType"), d = s.val();
if (RegExp("required").test(s.attr("lay-verify"))) {
c.splice(c.indexOf("required"), 1);
c.unshift("required");
}
if (s.removeClass(o), layui.each(c, function (t, l) {
var c, f = "", h = "function" == typeof a[l];
if (a[l]) {
console.log(s.attr('name') + ':' + h);
console.log(s.attr('name') + 'display:' + s.css("display"));
var flag = s.css("display") !== "none" ? (s.val() === '' && RegExp("required").test(s.attr("lay-verify"))) || (s.val() !== '' && s.attr("lay-verify").split("|").length > 0) : false;
var c = h ? f = a[l](d, r) : !a[l][0].test(d),
y = "select" === r.tagName.toLowerCase() || /^checkbox|radio$/.test(r.type);
if (f = f || a[l][1], "required" === l && (f = s.attr("lay-reqText") || f), c && flag) {
console.log(s.attr('name') + "是否是必填项或者非空命中校验:" + c)
console.log(s.attr('name') + "是否是必填项或者非空命中校验修改后:" + flag)
console.log(s.attr('name') + " 是否属于美化元素:" + y)
/*if(s.css("display") !== "none"){
console.log("需要验证")
} else if(s.val() === '' && RegExp("required").test(s.attr("lay-verify"))){
console.log("需要验证")
}else if(s.val() !== '' && c.length>0){
console.log("需要验证")
}else {
console.log("跳过验证")
}*/
return "tips" === u ? i.tips(f, function () {
open弹出层篇：
点击阴影层关闭弹出层关联cancel函数
n.find("." + l[7]).on("click", e), a.shadeClose && i("#layui-layer-shade" + t.index).on("click", function () {
var e = a.cancel && a.cancel(t.index, n);
e === !1 || r.close(t.index)
})修复success函数在ie8下提前执行导致表单组件未渲染完成的问题
var t = this, n = t.layero, a = t.config;
t.openLayer(), 6 == r.ie && t.IE6(n), n.find("." + l[6]).children("a").on("click", function () {
var e = i(this).index();
if (0 === e) a.yes ? a.yes(t.index, n) : a.btn1 ? a.btn1(t.index, n) : r.close(t.index); else {
var o = a["btn" + (e + 1)] && a["btn" + (e + 1)](t.index, n);
o === !1 || r.close(t.index)
}
}), s.pt.creat = function () {
var e = this, t = e.config, a = e.index, s = t.content, f = "object" == typeof s, c = i("body");
if (!t.id || !i("#" + t.id)[0]) {
switch ("string" == typeof t.area && (t.area = "auto" === t.area ? ["", ""] : [t.area, ""]), t.shift && (t.anim = t.shift), 6 == r.ie && (t.fixed = !1), t.type) {
case 0:
t.btn = "btn" in t ? t.btn : o.btn[0], r.closeAll("dialog");
break;
case 2:
var s = t.content = f ? t.content : [t.content || "", "auto"];
t.content = '<iframe scrolling="' + (t.content[1] || "auto") + '" allowtransparency="true" id="' + l[4] + a + '" name="' + l[4] + a + '" onload="this.className=\'\';" class="layui-layer-load" frameborder="0" src="' + t.content[0] + '"></iframe>';
break;
case 3:
delete t.title, delete t.closeBtn, t.icon === -1 && 0 === t.icon, r.closeAll("loading");
break;
case 4:
f || (t.content = [t.content, "body"]), t.follow = t.content[1], t.content = t.content[0] + '<i class="layui-layer-TipsG"></i>', delete t.title, t.tips = "object" == typeof t.tips ? t.tips : [t.tips, !0], t.tipsMore || r.closeAll("tips")
}
if (e.vessel(f, function (n, r, u) {
c.append(n[0]), f ? function () {
2 == t.type || 4 == t.type ? function () {
i("body").append(n[1])
}() : function () {
s.parents("." + l[0])[0] || (s.data("display", s.css("display")).show().addClass("layui-layer-wrap").wrap(n[1]), i("#" + l[0] + a).find("." + l[5]).before(r))
}()
}() : c.append(n[1]), i(".layui-layer-move")[0] || c.append(o.moveElem = u), e.layero = i("#" + l[0] + a), t.scrollbar || l.html.css("overflow", "hidden").attr("layer-full", a)
}).auto(a), i("#layui-layer-shade" + e.index).css({
"background-color": t.shade[1] || "#000",
opacity: t.shade[0] || t.shade
}), 2 == t.type && 6 == r.ie && e.layero.find("iframe").attr("src", s[0]), 4 == t.type ? e.tips() : e.offset(), t.fixed && n.on("resize", function () {
e.offset(), (/^\d+%$/.test(t.area[0]) || /^\d+%$/.test(t.area[1])) && e.auto(a), 4 == t.type && e.tips()
}), t.time <= 0 || setTimeout(function () {
r.close(e.index)
}, t.time), e.move().callback(), l.anim[t.anim]) {
var u = "layer-anim " + l.anim[t.anim];
e.layero.addClass(u).one("webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend", function () {
i(this).removeClass(u)
})
}
t.isOutAnim && e.layero.data("isOutAnim", !0);
t.success && t.success(e.layero, e.index)
}
}, 数据表格篇
解决表格筛选列不靠左情况<span style='float: left'>
i.each(function (i, n) {
var l = t(this), r = l.attr("lay-skin"), s = (l.attr("lay-text") || "").split("|"),
o = this.disabled;
"switch" === r && (r = "_" + r);
var u = e[r] || e.checkbox;
if ("string" == typeof l.attr("lay-ignore")) return l.show();
var d = l.next("." + u[0]),
f = t(['<div class="layui-unselect ' + u[0], n.checked ? " " + u[1] : "", o ? " layui-checkbox-disbaled " + c : "", '"', r ? ' lay-skin="' + r + '"' : "", ">", function () {
var e = n.title.replace(/\s/g, ""), t = {
checkbox: [e ? "<span style='float: left'>" + n.title + "</span>" : "", '<i class="layui-icon layui-icon-ok"></i>'].join(""),
_switch: "<em>" + ((n.checked ? s[0] : s[1]) || "") + "</em><i></i>"
};
return t[r] || t.checkbox
}(), "</div>"].join(""));
d[0] && d.remove(), l.after(f), a.call(this, f, u)
})
1055
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
