最近写登录的页面，发现通过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。

其他文章，欢迎关注微信公众号测试架构师养成记。