XHR failed loading: POST

现象 

DevTool的 Console报错:

VM249 jquery.js:8241 XHR failed loading: POST "http://localhost:8093/api_xxxx".

 send@VM249 jquery.js:8241
 ajax@VM249 jquery.js:7720
 jQuery.(anonymous function)@VM249 jquery.js:7246
 calcProductRate@VM252 api.js:15
 onclick@api:119

 api.js:15

$.post(url, args, function(data) {

DevTool的 Network的报错

XHR 请求的资源 报红色, status  (canceled)

分析
 

按钮的type写成了submit

<input  type="submit" value="查询">

The event successfully sends the request, but is is canceled then (but processed by the server). The reason is, the elements submit forms on click events, no matter if you make any ajax requests on the same click event.

 

解决

1. To prevent request from being cancelled, JavaScript event.preventDefault(); have to be called:

<script>
  $("#call_ajax").on("click", function(event){
     event.preventDefault();
     $.ajax({
        ...    
     });
  });
</script>

 2. 改成button

<input  type="button" value="查询">

参考

https://stackoverflow.com/questions/12009423/what-does-status-canceled-for-a-resource-mean-in-chrome-developer-tools

  • 3
    点赞
  • 0
    评论
  • 2
    收藏
  • 扫一扫,分享海报

参与评论 您还未登录,请先 登录 后发表或查看评论
©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值