如何将 AJAX 请求从原版 JS 重写为 JQuery

Question

目前我正在学习JS，并且非常熟悉原版JS，但是JQuery语法对我来说似乎有点奇怪。所以我在JS上有以下代码，它工作得很好：

let xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    questions = JSON.parse(this.responseText);
    loadQuestionsData();
  }
};
xhttp.open("GET", "http://localhost:8080/questions", true);
xhttp.send();

在这里，我为我的本地主机创建新的XMLHttpRequest并获取问题的JSON，当响应准备就绪时，执行函数loadQuestionsData(((它将问题列表插入表中(。我试图用 JQuery 重写它，但它不起作用，我不明白为什么。这是我的第n次尝试这样做：

$(document).on('readystatechange', function() {
  $.ajax({
    url: "http://localhost:8080/questions",
    type: 'GET',
    success: function() {
      questions = JSON.parse(this.responseText);
      loadQuestionsData();
    }
  })
})

我也尝试了以下方法，但它也不起作用：

$(document).on('readystatechange', function() {
  questions = JSON.parse($.ajax({
    url: "http://localhost:8080/questions",
    type: 'GET',
  })).responseText;
})

我想问题出在语法上？代码停止在响应文本上运行。

Answer 1

文档对象没有 onreadystatechange 事件 - 这是 XHR 对象的一部分。 jQuery AJAX 方法将为您处理状态更改(这是简单性的一部分(。

此外，成功处理程序有一个参数，即响应文本，因此需要将其添加到函数签名中，以便可以在函数中访问它。

改为此...

  $.ajax({
      url: "http://localhost:8080/questions",
      type: 'GET',
          success: function(responseText) {
          questions = JSON.parse(responseText);
          loadQuestionsData();
      }
  })

Answer 2

您不需要使用 ：

$(document).on('readystatechange', function() {
});

因为readystatechange是 XmlHttpRequest(( 的属性;

只需将您的代码更改为：

  $.ajax({
    url: "http://localhost:8080/questions",
    type: 'GET',
    success: function() {
      questions = JSON.parse(this.responseText);
      loadQuestionsData();
    }
  });