Javascript 在jQuery/JS中将文件读入字符串

这个标题是不言自明的：我需要通过jQuery读取HTML文件，并将其内容存储到字符串变量中

我尝试使用.load和$.get，但它们无法满足我的需要

这是我迄今为止尝试的代码，基于以下注释，但它们根本没有填充我的模板变量：

var template = "";

$.ajax({
    url: 'includes/twig/image_box.twig',
    type: 'get',
    success: function(html) {
        var twig = String(html);
        template.concat(twig);
    }
});

console.log(template);

以及：

奇怪的是为什么这不起作用。至少对我来说很奇怪。这就是我在PHP中填充变量的方式，因此我将相同的逻辑带到了JS中。也许还有别的办法

p.S:V我也尝试了所有的替代方法，比如用+=连接，在回调函数内部用=”分配给模板，但没有任何效果

---

感谢那些试图帮助我的人

也许您应该使用$.AJAX尝试一个AJAX请求

检查jQueryAPI

编辑：添加了一个演示

我重新阅读了您的问题，注意到您正在调用ajax请求正上方的控制台日志，但您忘记了ajax是异步的，这意味着页面将执行请求，并且只有在响应返回成功时才会设置模板值。因此console.logtemplate不会出现，因为它可能尚未加载

var template = "";

$.ajax({
    url: 'includes/twig/image_box.twig',
    type: 'get',
    success: function(html) {
        var twig = String(html);
        template.concat(twig);
        console.log(template); // the change!
    }
});

或

---

也许您应该使用$.AJAX尝试一个AJAX请求

检查jQueryAPI

编辑：添加了一个演示

我重新阅读了您的问题，注意到您正在调用ajax请求正上方的控制台日志，但您忘记了ajax是异步的，这意味着页面将执行请求，并且只有在响应返回成功时才会设置模板值。因此console.logtemplate不会出现，因为它可能尚未加载

var template = "";

$.ajax({
    url: 'includes/twig/image_box.twig',
    type: 'get',
    success: function(html) {
        var twig = String(html);
        template.concat(twig);
        console.log(template); // the change!
    }
});

或

您可以尝试以下方法：

//as you see I have used this very page's url to test and you should replace it
var fileUrl = "/questions/20400076/reading-a-file-into-a-string-in-jquery-js";
jQuery.get(fileUrl).then(function(text, status, xhr){
   //text argument is what you want
});

如果无法使用，请尝试浏览器是否可以打开该文件。如果可以的话，您最好在jQuery中尝试ajax方法，如果不行，您可能会在应用程序服务器的权限或类似问题上遇到一些问题。

您可以尝试以下方法：

//as you see I have used this very page's url to test and you should replace it
var fileUrl = "/questions/20400076/reading-a-file-into-a-string-in-jquery-js";
jQuery.get(fileUrl).then(function(text, status, xhr){
   //text argument is what you want
});

---

如果无法使用，请尝试浏览器是否可以打开该文件。如果可以的话，您最好在jQuery中尝试ajax方法，否则您可能会在应用程序服务器的权限或类似问题上遇到一些问题。

HTML文件在web上可用吗？还是用户正在上传它？为什么不加载并开始工作？出了什么问题？你是如何使用它们的？@FritsvanCampen HTML文件在我的服务器上，我只需要它作为一个字符串来使用它@Juhana Load工作了，但我需要将结果存储在一个变量中，并且.Load渴望立即将结果附加到选择器中。$.get应该可以工作。你能告诉我们你的代码吗？不幸的是，我现在不能，我不在这个项目的电脑上。但我知道，$.get在我尝试记录对象时一直返回一个对象。稍后我将向您展示代码。HTML文件在web上可用吗？还是用户正在上载它？为什么不加载并获得工作？出了什么问题？你是如何使用它们的？@FritsvanCampen HTML文件在我的服务器上，我只需要它作为一个字符串来使用它@Juhana Load工作了，但我需要将结果存储在一个变量中，并且.Load渴望立即将结果附加到选择器中。$.get应该可以工作。你能告诉我们你的代码吗？不幸的是，我现在不能，我不在这个项目的电脑上。但我知道，$.get在我尝试记录对象时一直返回一个对象。稍后我将向您展示代码。此变体仅用于在success中输出抓取的内容，它不会将文本连接到另一个空白字符串中，并使HTML准备好使用AJAX调用。我尝试过这样的方法：以及所有类似的操作，比如使用+=等。这个变体只用于在success中输出抓取的内容，它不会将文本连接到另一个空白字符串中，并让HTML准备好使用AJAX调用。我尝试过这样的方法：所有类似的操作，比如使用+=等等。这个替代方法给了我如上所述的结果，我可以在匿名函数中使用HTML，但不能将其内容连接到外部变量。我的代码如下所示：首先，您不需要执行var html=Stringtext；原因文本已经是字符串。就调用jQuery.get时的ajax调用而言，浏览器从服务器实际获取文件需要一些时间，然后一旦完成，然后。。。负责执行下一步并调用回调函数。将下一步的代码放入console.logtemplate；//不在新函数中工作，并在回调中调用它。我已经在这个JSFIDLE示例中更改了您的代码，检查一下，您的问题就解决了：这是否违反了跨源策略？这个替代方案给出了如上所述的结果，我可以在匿名函数中使用HTML，但不能将其内容连接到外部变量。我的代码如下所示：首先，您不需要执行var html=Stringtext；原因文本已经是字符串。就ajax调用而言，当您调用jQuery.get时，它需要一些时间

---

浏览器从服务器上实际获取您的文件，然后一旦完成，它就会。。。负责执行下一步并调用回调函数。将下一步的代码放入console.logtemplate；//不在新函数中工作，并在回调中调用它。我已经在这个JSFIDLE示例中更改了您的代码，检查一下，您的问题就解决了：这是否违反了跨源策略？

//as you see I have used this very page's url to test and you should replace it
var fileUrl = "/questions/20400076/reading-a-file-into-a-string-in-jquery-js";
jQuery.get(fileUrl).then(function(text, status, xhr){
   //text argument is what you want
});