layui 表单ajax不执行,layui表单提交使用form.on('submit(sub)',function (){}) 使用ajax请求时回调不执行的原因及解决方法...

ayui使用官方的表单模块form.on('submit(sub)',function (){}) 提交，使用ajax请求向后台请求一个执行结果，根据结果进行处理，出现回调无法执行，并且页面出现了刷新

之前也遇到过这个问题，直接使用将form标签修改成了div，通过jquery为提交按钮添加点击事件，而不用submit提交表单。

今天在为毕设添加修改密码的功能的时候，再次遇到了这个问题，刚好有点空闲，决定找出真正的原因。

首先，debug服务端逻辑，发现能正常取值，返回值也是正常

之后，检查ajax请求的 dataType是没问题的，我在服务端返回了一个字符串，我也指定了text属性。

百度(面向百度编程)之后发现原因是当button的type为submit的使用，页面会自动刷新，而我们并不希望他刷新。

参考链接：https://blog.csdn.net/laukitto/article/details/69230348

既然知道了原因，那么问题就好解决了，只要在submit方法的最后添加个 return false就解决了

下面是请求的JS代码，最后一行添加 return false 问题解决

form.on('submit(sub)',function (){

var newpwd = $('#newpwd').val();

var confirmpwd = $('#confirmpwd').val();

if(newpwd != confirmpwd){

$('#rcp').attr('hidden','hidden');

$('#ecp').removeAttr('hidden');

layer.msg("两次输入密码不一致");

return false;

}else{

var data = {

originPwd:$('#originpwd').val(),

newPwd:$('#newpwd').val()

}

$.ajax({

url:'/user/changePwd',

type:'post',

dataType:'text',

contentType: 'application/json',

data:JSON.stringify(data),

timeout:2000,

beforeSend:function (xhr) {

xhr.setRequestHeader(header,token);

},

success:function(data){

console.log(data);

if(data == 'success'){

layer.msg("密码修改成功");

location.href = "/user/loginpage"

}else{

layer.msg("密码修改失败")

}

},

error:function () {

layer.msg("密码修改失败")

}

})

}

return false;

})

---------------------------------------xadmin中弹出页面，异步提交被关闭---------------------------------------------------------------------------

//监听提交

form.on('submit(add)', function (data) {

//console.log(data);

//发异步，把数据提交给php

var name = data.field.name;

var desc = data.field.desc;

$.ajax({

type: 'post',

url: "{:url('admin/AdminRole/save')}",

data: {name: name,remark:desc},

success: function (res) {

if (res.status == 200) {

layer.alert(res.msg, {icon: 6}, function () {

// 获得frame索引

var index = parent.layer.getFrameIndex(window.name);

//关闭当前frame

parent.layer.close(index);

//刷新页面

parent.location.reload();

});

//parent.layer.reload();

} else {

layer.alert(res.msg, {icon: 5}, function () {

// 获得frame索引

var index = parent.layer.getFrameIndex(window.name);

//关闭当前frame

parent.layer.close(index);

//刷新页面

parent.location.reload();

});

}

}

});

return false;

});