让AJAX与JavaScript协同工作

我只想指出，我知道如何使用jQuery和AngularJS实现这一点。我目前正在从事的项目要求我使用纯JavaScript

我试图让AJAX只使用普通JavaScript。我使用Java/Spring进行后端编程。以下是我的JavaScript代码：

/** AJAX Function */
ajaxFunction = function(url) {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (xhttp.status == 200) {
            var JSONResponse = JSON.parse(xhttp.responseText);
            return JSONResponse;
        }
    }
    xhttp.open('GET', url, true);
    xhttp.send();
}

/** Call Function */
searchResults = function() {
    var test = ajaxFunction('http://123.456.78.90:8080/my/working/url');
    console.log(test);
}

/** When the page loads. */
window.onload = function() {
    searchResults();
}

值得注意的是，当我直接转到浏览器地址栏中的URL时（例如，如果我直接转到链接），我会在浏览器中得到JSON响应

当我将鼠标悬停在

xhttp.status

上时，状态是0，而不是200，尽管我知道我调用的链接可以工作。这是您必须在Spring的控制器中设置的吗？我认为情况并非如此，因为当我在网络选项卡中检查这个JSURL调用时，它表示状态为200

---

总而言之，此响应返回为

未定义
。我不明白为什么。我做错了什么？
异步执行
XMLHttpRequest
，这意味着请求被触发，其余代码继续运行。提供回调，当异步操作完成时，调用回调函数。AJAX请求完成后调用
onreadystatechange
函数。在您的示例中，
ajaxFunction
将在执行
xhttp.send（）
行之后立即返回，因此您的
var测试中不会像我假设的那样包含JSON

为了在AJAX请求完成时执行某些操作，需要使用回调函数。如果您希望如上所述将结果记录到控制台，可以尝试以下操作：

var xhttp;

var handler = function() {
    if(xhttp.readyState === XMLHttpRequest.DONE) {     
        if (xhttp.status == 200) {
            var JSONResponse = JSON.parse(xhttp.responseText);
            console.log(JSONResponse);
        }
    }
};

/** AJAX Function */
var ajaxFunction = function(url) {
    xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = handler;
    xhttp.open('GET', url, true);
    xhttp.send();
};    

/** Call Function */
var searchResults = function() {
    ajaxFunction('http://123.456.78.90:8080/my/working/url');
};

/** When the page loads. */
window.onload = function() {
    searchResults();
};

如果你想更多地了解XMLHttpRequest的工作原理，那么他是一位比我好得多的老师：）
我有一些JavaScript方面的经验，所以我绝对不会把自己归类为“毫无线索”。我的问题是关于AJAX的。我也从未说过jQuery会取代JavaScript。我以前问过JavaScript问题，一个常见的回答是，无论我想做什么，在jQuery中都更容易做，这就是我第一次陈述的原因。你的评论既粗鲁又不具建设性。如果这个问题真的引起了那么多的不满，那么你可能根本就没有回应。请查看浏览器控制台中的“网络”选项卡，并在浏览时查看GET请求的性质。特别是，请查看请求头。例如，您可能必须显式设置mime类型。然后，只需模拟浏览器在JavaScript请求中成功执行的操作。它是公共URL吗？如果是的话，你能发布它吗？我必须在任何地方调用回调函数吗？我将其视为ajaxFunction中的一个参数。我在哪里使用它？很抱歉，在这种情况下不需要回调参数，我忘了删除它。尽管如果您也希望这样做，可以将回调函数传递给Ajax函数