在layer中,layer.open弹出层按钮可设置多个,当有多个按钮时,yes回调对应第一个确定按钮,第二个按钮回调为btn2,第三个为btn3,依次类推。
现在有两个按钮:第一个为“取消”,第二个是“提交”。要求用户名和密码进行校验。
碰到的问题是:
数据进行校验,如果校验不通过,点击“提交”按钮,则提示错误信息,不关闭弹出层,继续停留在当前弹出层。然后情况是点击提交按钮,即使表单验证不生效,也关闭了当前弹出层。`
原因是:第二个按钮的回调没有return false,这导致cancel的回调对第二个按钮起了作用,导致弹出层关闭。
解决方法:在第二个按钮回调中(即function回调函数中)设置return false。
btn: ["取消", "提交"],
btn2: function () {
if( $("#addUserNameTip").text()=="该用户名未被注册" &&
$("#addPwdTip").text()=="密码设置正确"){
$.ajax({
type: "post",
skin: "layui-layer-molv", //加上边框
url: "insert",
// contentType:"application/json;charset=utf-8",
data: {
userName: $("#add-userName").val(),
passWord: $("#add-pwd").val(),
realName: $("#add-rln").val(),
},
success: function () {
$("#userTable tr:gt(1)").remove();
showUsers(currP);
},
error: function () {
alert("数据提交错误!");
},
})
}else{
//重点!!!!!!!!!
return false;//数据验证不通过时,弹出层不关闭
}