使用XMLhttprequest

Question

我是JS的新手，试图创建下一步的简单页面：

1. 获取某个服务器的IP
2. 然后向此服务器发送get请求
3. 解析获得回复，
4. 将过滤后的行添加到html页面上的表格中。

我能够通过浏览器控制台执行所有步骤，但是当由于某种原因移动到具有get函数的JS文件时，函数不会返回值。

在下面的代码中，剪辑行6将在控制台中打印undefined。 知道如何从函数getStatus返回“状态”吗？ 第5行和第6行之间是否应该超时？

谢谢！

$("input[type='text']").keypress(function(event){
   if(event.which === 13){
    var address = $(this).val();
    var urlStat = 'http://'+address+':666/bla?open=stats';
    var status = getStatus(urlStat);
    console.log(status);

    $("input[type='text']").val('');
    $('table').append("<tr><th>"+address+"</th><th><ul></ul></th><th></th></tr>");
}
});

function getStatus(url){
var xhr = new XMLHttpRequest;

xhr.open("GET", url);
xhr.send();
xhr.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {

    var regexStatus = /(\w+ state:.*?)</g
    var response = xhr.responseText;
    var statuses = response.match(regexStatus);
    console.log('Inside function getStatus'+statuses);
    return statuses;
    };
}
};

Answer 1

您的代码存在的问题是，在您的请求发送后会返回状态。这给了一个小延迟。因为您立即要求constructor(private route: ActivatedRoute, genericViewModel: GenericResponseObject<SingleItemViewModel>, singleItemService: GenericHttpClientService,) { this._genericViewModel = genericViewModel; this._singleItemService = singleItemService; this.route.params.subscribe(params => this.getHomeItemHttpCall(params.id)); } private getHomeItemHttpCall(id: string): void { this._singleItemService.GenericHttpGet<GenericResponseObject<SingleItemViewModel>>(this.GetHomeItemUrl + id).subscribe(data => { if (data.isSuccess) { this._genericViewModel.data = data.data; } }, error => { console.log(error); }); } 的返回值，您将获得getStatus。 您可以使用回调函数解决此问题：

undefined

使用函数调用getStatus函数，该函数在您收到请求的响应后调用。 例如：

function getStatus(url,callback){
    var xhr = new XMLHttpRequest;

    xhr.open("GET", url);
    xhr.send();
    xhr.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {

            var regexStatus = /(\w+ state:.*?)</g
            var response = xhr.responseText;
            var statuses = response.match(regexStatus);
            console.log('Inside function getStatus'+statuses);
            if(callback) callback(statuses);
      };
   }
};

修改

要获得更好更长的解释，请考虑查看How do I return the response from an asynchronous call?