XHR 加载失败：POST答案

【问题标题】：XHR failed loading: POSTXHR 加载失败：POST
【发布时间】：2016-11-17 09:23:28
【问题描述】：

所以我正在尝试使用 ajax 发布，但它不会通过。

这是我的 javascript

$.ajax({
      type: 'POST',
      contentType: "",
      url: 'some url',
      data: order,
      dataType: 'json',
      success: function() {
        Materialize.toast('Order added successfully', 4000, 'android-success');
        console.log('order posted');

      },


      error: function() {
        Materialize.toast('Something went wrong', 4000, 'android-error');
      }

    }); // $.ajax post

我没有收到错误消息，也没有从 ajax 获得成功。但我收到上面列出的 chrome 控制台错误 XHR failed loading: POST

我尝试设置内容类型和数据类型无济于事。我猜，问题出在对象格式或类似的东西上。

可能有用的信息—— 这是我的代码的基本大纲。

我有一个带有点击事件的按钮
在那个函数中我有 if else 语句
如果输入字段为空白 event.preventdefault() 按钮单击
其他 ajax 帖子

这是失败日志下的信息

send    @   jquery-3.1.0.js:9392

ajax    @   jquery-3.1.0.js:8999

(anonymous function)    @   ajax.js:20

mightThrow  @   jquery-3.1.0.js:3508

process @   jquery-3.1.0.js:3576

非常感谢您对此事的任何帮助。

【问题讨论】：

just wont go through 从 where 到 where?
您需要为 ajax 请求提供一个 URL。 url: 'some url',我不认为这不是你想要做的。
我正在处理跨域，但后端处理了这一点，因为我可以毫无问题地 GET
这是一个虚拟 URL，我得到的 URL 在 GET 上效果很好，即使它是跨域的。如果 URL 无法访问或拼写错误，我会从 jquery 中得到一个错误。

标签： javascript jquery ajax post xmlhttprequest

【解决方案1】：

我让它工作了。问题在于页面重新加载。因此，在发布请求可以通过网页之前，该网页将重新加载，这不会导致任何错误，而只会导致失败的日志。呃，这样的菜鸟错误。

【讨论】：

能否详细说明您发现的问题？
触发 AJAX 请求的按钮也重新加载了页面，中断了我的 AJAX 内部工作。
我遇到了这个问题。你能解释一下你做了什么来修复它吗？
我的问题是触发 ajax 帖子的按钮导致网页在我得到结果之前重新加载，因此没有关于错误的详细信息。检查您的href 属性，确保它不会重新加载页面。为了安全起见，把这个#0 作为属性值。所以像这样：<a href="#0" id="ajaxCall">AJAX</a> 这解决了我的问题。
你是一个天才和救星。我从没想过这会是原因。前端开发很奇怪。

【解决方案2】：

当窗口被加载时，为表单添加一个事件监听器并阻止默认操作。

 <script>
 window.addEventListener("load", function () {
    //not jquery!
    // Access the form element...
    var form = document.getElementById("myFormId");
    
    // ...and take over its submit event.
    form.addEventListener("submit", function (event) {
        event.preventDefault(); // prevent form submission and reloading the page.

        //your code to validate or do what you need with the form.
    });
});
</script>

【讨论】：