偶然碰到一个小Bug

ajax请求执行后返回了一个canceled(状态码)

但是后台却接受了参数并且执行成功0。0

刚看到这个状态的时候是一脸懵逼的、、、、

之前并没见过这样的状态码

经过参数确认并且再三确认

并没有发现什么异常、、、、

后来发现Url在请求的时候被莫名其妙的带上了些参数

经过检查html代码发现莫名其妙的出现了一个from标签

而我的提交按钮绝然还是个submit！！

没错，我在给人家擦屁股

原因

究其原因

仅仅是因为from action事件与绑定与submit按钮上的click事件同时触发。

from action将表单内容以参数的形式追加到了url的末尾

而url变更则会导致页面重新加载

而这恰恰就是导致post请求在执行后就立即被终止的罪魁祸首！！

小结

1.在URL变更后，会对当前正在执行的ajax进求进行中止操作

2.在使用到ajax的时候，尽量不要在form内使用submit进行提交

一次ajax请求导致status为canceled的原因小记的更多相关文章

  1. ajax请求导致status为canceled(无任何回调数据)的原因

    1.故障现象 一个普通的ajax请求,请求能够到达controller,也能正常处理业务,但是ajax的回调函数为空,即没有任何状态和数据返回,使用谷歌浏览器查看请求状态如下图: 出现该错误:简单来说 ...

  2. AJAX请求时status返回状态明细表（转）

    转自:http://www.cnblogs.com/wangking/p/6530904.html AJAX请求时status返回状态明细表 readyState的五种状态2010-03-04 18: ...

  3. AJAX请求时status返回状态明细表

    AJAX请求时status返回状态明细表 readyState的五种状态2010-03-04 18:24对于readyState的五种状态的描述或者说定义,很多Ajax书(英文原版)中大都语焉不详 在 ...

  4. ajax 请求被终止 chrome查询发现请求状态status为canceled

    检查页面的network执行中发现页面被刷新了url改变了导致请求在请求过程中被终止了. 检查代码发现在 submit方法中最后写了个  location.reload();方法 来重载页面 虽然是卸 ...

  5. 用Promise解决多个异步Ajax请求导致的代码嵌套问题【转】

    问题 前端小同学在做页面的时候,犯了个常见的错误:把多个Ajax请求顺序着写下来了,而后面的请求,对前面请求的返回结果,是有依赖的.如下面的代码所示: var someData; $.ajax({ u ...

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

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

  7. AJAX请求时status返回状态明细表 readyState的五种状态

    在<Pragmatic Ajax A Web 2.0 Primer >中偶然看到对readyStae状态的介绍,感觉这个介绍很实在,摘译如下: 0: (Uninitialized) the ...

  8. [jQuery]ajax请求导致浏览器崩溃

    $("#xxx").val() not $("#xxx") 如果忘记加上.val()会导致chrome崩溃

  9. vue项目使用axios发送请求让ajax请求头部携带cookie

    最近做vue项目时遇到登录权限问题,登录以后再发送的请求头部并没有携带登录后设置的cookie,导致后台无法校验其是否登录.检查发现是vue项目中使用axios发送ajax请求导致的.查看文档得知ax ...

随机推荐

  1. Scrum Meeting 10.28

    今天大部分同学仍停留在学习阶段,进度快的同学已经在配置SQLserver. 成员 今日完成任务 明日计划 所用时间 徐越 配置SQLserver,试用java程序连接数据库 学习servlet,htt ...

  2. 5233杨光--Linux第一次实验

    学习计时:共14小时 读书:2小时 代码:7小时 作业:2小时 博客:3小时 一.学习目标 1. 能够独立安装Linux操作系统   2. 能够熟练使用Linux系统的基本命令   3. 熟练使用Li ...

  3. 奔跑吧DKY——团队Scrum冲刺阶段-Day 1-领航

    各个成员在 Alpha 阶段认领的任务 修改 序号 修改 具体描述 1 游戏过程 取消原来的跳跃和俯身按钮,保留跳跃的功能,可以触屏滑动来躲避地面障碍物,也可以躲避另一种陷阱障碍物 2 闯关功能 取消 ...

  4. 20145214《网络攻防》逆向及Bof基础实践

    20145214<网络攻防>逆向及Bof基础实践 实践说明 本次实践的对象是一个名为pwn1的linux可执行文件. 该程序正常执行流程是:main调用foo函数,foo函数会简单回显任何 ...

  5. Javascript实现大整数加法

    记得之前面试还被问到过用两个字符串实现两个大整数相加,当时还特别好奇好好的整数相加,为什么要用字符串去执行.哈哈,感觉当时自己还是很无知的,面试官肯定特别的无奈.今天在刷算法的时候,无意中看到了为什么 ...

  6. Sprint计划表

    Sprint会议计划 一.Sprint  需求 准备环节:小组成员利用周六周日在网上查阅Android开发的教程,练习开发一些简单的小程序,具备一定的开发能力,在电脑上搭建Android开发环境,做好 ...

  7. beat冲刺（7/7）

    目录 摘要 团队部分 个人部分 摘要 队名:小白吃 组长博客:hjj 作业博客:beta冲刺(7/7) 后敬甲(组长) 过去两天完成了哪些任务 ppt制作 视频拍摄 接下来的计划 准备答辩 还剩下哪些 ...

  8. linshi18

    #include<iostream> using namespace std; int n,m,k; #define max 100 char mmap[max][max]; int mm ...

  9. Gradle入门（5）：创建二进制发布版本

    在创建了一个实用的应用程序之后,我们可能想将其与他人分享.其中一种方式就是创建一个可以从网站上下载的二进制文件. 这篇教程描述了如何创建一个二进制发布版本,满足以下需求: 二进制发布一定不能使用所谓的 ...

  10. CANOpen学习指南

    对于初学者,相对于其他总线的资料来说,在国内CANOpen的资料并不多.而且并不是所有资料都适合初学者看的.这里给出一些建议,对CANOpen感兴趣的,可以参考一下学习的顺序. 前提:需要对CAN总线 ...