最近写登录的页面,发现通过ajax请求后台的时候,监控台返回该请求的状态是canceled。
原因
仅仅是由于之前为了在输入账号时让浏览器进行自动补全,而将原先的div更换为了form,而不巧的是之前的登录事件源使用的是button。
而至于为什么status = canceled,是由于在提交时,form action与绑定于button上的click事件会同时触发。form action将表单内容以serach的形式追加至当前url上,url变更后会导致页面重新加载, 而这正是导致post请求在执行后就被终止的原因。
解决方案
form.on("submit(login)",function(data){
$.ajax({
url:"/schema/login",
data:{
username:data.field.username,
password:data.field.password
},
dataType: "json",
contentType: "application/json; charset=utf-8",
async:false,
success:function (res) {
if("success" == res){
window.location.href = "../index.html";
return false;
}
},
error:function (res) {
alert("失败,请重新登录!");
}
})
return false;
})
最后发现是ajax请求默认是异步的。我把请求改成同步的就行了。设置如下参数:async: false。