xhr 请求的回调不起作用

Question

当我使用 Google chrome 开发控制台到运行我的代码时，我遇到了一些问题。我的当前页面是 vk.com。我用这个代码

var request_url = 'https://vk.com/dev/openapi';//similar domain
var requestData = function(request_url, callback) {
    var xhr = new XMLHttpRequest();
        xhr.open('GET', request_url, true);
        xhr.onreadystatechange = function() {
            if(xhr.readyState==4 && xhr.status==200) {
                var content = xhr.responseText;
                console.log(callback(content))
                callback(content);
            }
        }
    xhr.send();
};

var dataEl = requestData(request_url, function(content) {
        var el = document.createElement( 'html' );
        el.innerHTML = content;
        return el;
});

它不起作用，因为 dataEl 未定义，但 console.log 告诉我......我想要什么。

如果使用这样的代码：

var requestData = ...(similar)
var contentNew = requestData(request_url, function(content){return   content});
var el = document.createElement( 'html' );
el.innerHTML = contentNew;

el 不是空对象或未定义对象。这就是我想要的。

在没有手动输入的情况下如何使用XHR？

Answer 1

从回调 return 没有意义，要么链接更多回调，要么使代码事件驱动。

除了那个和一些旧的编码风格之外，您唯一的错误似乎是在您似乎想要 el.innerHTML = content;

时尝试设置 el.innerHTML = dataEl;

这是一个使用 XMLHttpRequest

的演示

function xGET(url, callback, error_callback) {
    var xhr = new XMLHttpRequest();
    xhr.addEventListener('load', callback);
    if (error_callback)
        xhr.addEventListener('error', error_callback);
    xhr.open('GET', url);
    xhr.send();
    return xhr; // why not?
};

var my_url = '/'; // for demo

xGET(my_url, function () {
    var el;
    // creating a <html> doesn't make much sense
    // this example will use a <div> instead
    el = document.createElement('div');
    // do something with your XHR's data
    el.textContent = this.responseText;
    // do something with `el`
    document.body.appendChild(el);
}, function () {
    var el = document.createElement('div');
    el.textContent = 'Something went wrong :(';
    document.body.appendChild(el);
});

DEMO on jsfiddle

xhr 请求的回调不起作用

Callback on xhr request doesn't work

javascript

google-chrome

xmlhttprequest

callback