jQuery将文件内容读取到JavaScript中的变量[重复]

Question

我已经为我的特殊困境寻找答案，我认为这一定与我自己的误解有关（我是 JS 新手）。我知道类似的主题，但没有完全解决我想确定的内容 - 如果我错过了之前发布的内容，请原谅我。

我已经总结了我正在尝试对以下 JavaScript 执行的操作，该 JavaScript 利用 jQuery 的 get 将文件内容读取到变量（我试图避免使用 XMLHttpRequest() 来读取文件所涉及的所有喧嚣）服务器端）：

window.onload = function(){

var refFile = "./myFile"; // path to my txt file
var fileContent;

    $.get(refFile, function(response) {
         fileContent = response;
         alert(fileContent);  // I get data here just fine
    });

    alert(fileContent);          // undefined here - how can I have fileContent defined here?

}

如果最好在纯 JS 中使用 XMLHttpRequest，那很好，但我只想知道如何使值在检索函数之外存在 - 例如，与其他函数一起使用。

关于我缺少什么的任何想法？

任何帮助将不胜感激。

Answer 1

$.get() 函数异步工作，因此 fileContent 不包含响应。

window.onload = function(){

  var refFile = "./myFile"; // path to my txt file
  var fileContent;

  $.get(refFile, function(response) {
    // do something here
  }).done(function(response){
    fileContent = response;
  });

  alert(fileContent); // not undefined anymore

}

看看documentation

Answer 2

这段代码应该适合你。

var refFile = "./myfile"; // path to my txt file
function readBody(xhr) {
    var data;
    if (!xhr.responseType || xhr.responseType === "text") {
        data = xhr.responseText;
    } else if (xhr.responseType === "document") {
        data = xhr.responseXML;
    } else {
        data = xhr.response;
    }
    return data;
}

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
        console.log(readBody(xhr));
    }
}
xhr.open('GET', refFile, true);
xhr.send(null);