Question

我正在使用javascript文件存储图像列表和其他内容。我想在运行时，页面加载期间以及单击按钮后读取这些文件之一。我可以将javascript文件作为脚本加载，但无法立即访问其内容。

这是我无法使用javascript加载本地文件的解决方案。

<script>
function Get_Slide_Show(Idx) {
  Raw_Album_Info = '';
  alert('Before: ' + Raw_Album_Info);
  albumPath = 'photos/' + albumList[Idx];
  var script = document.createElement('script');
  script.src = albumPath + '/album_info.js';
  // document.head.appendChild(script);
  document.getElementsByTagName('head')[0].appendChild(script);
  alert('After: ' + Raw_Album_Info);
}

function Load_Slide_Show(Idx) {
  Get_Slide_Show(Idx);
  Load_Album_Info();
}

function Init_Slide_Show() {
  Load_Album_List("photos");
  Load_Slide_Show(0);
  showSlides();
}
</script>

Init_Slide_Show在页面加载时运行。

Load_Slide_Show在用户单击按钮时运行。

问题出在Get_Slide_Show中。它加载并附加选定的javascript文件，就像

Raw-Album_Info = 'image1.jpg\n'+image2.jpg\n';

我从一开始就重置Raw_Album_Info，并且第一个警报确认了这一点。我希望第二个警报显示Raw_Album_Info的新值。不是。

如果我删除行

Album_Info = '';

然后第二次运行Get_Slide_Show警报，显示上一次调用的值。

所以我可以读取变量，但是不能立即访问它。我应该使用insertBefore还是调用某种刷新？

Answer 1

在将脚本元素附加到文档之后的某个时间异步地加载脚本元素。发布的代码正在尝试访问 Raw_Album_Info在脚本加载之前。

尝试在脚本元素中添加加载事件处理程序以在加载后运行代码-可以首次访问处理程序中的Raw_Album_Info的值。

Answer 2

在文档加载完成之前，未定义

Raw_Album_Info 。您可以执行document.readystate调用或其他操作，但是在下面我使用函数 updatetest（），该函数使用setTimeout继续调用自身，直到定义了 Raw_Album_Info 。

在album_info.js中，使用倾斜的滴答声`（在〜键下方）会有所帮助。 `勾号位于 var 声明中所需文本的前后。如果使用勾号，则很容易编写一个简短的脚本，该脚本将自动从原始文本文件中创建.js文件。例如，如果您的原始文本文件是album_info.txt，则bash脚本将如下所示：

echo -n "var x=\`" > album_info.js
cat album_info.txt >> album_info.js
echo "\`" >> album_info.js

您在问题记录中的 Raw_Album_Info 变量中的破折号错误。也许这只是一个写错误，但是如果该错误确实存在于您的album_info.js代码中，则可能会阻止 real Raw_Album_Info 变量获得结果。我的album_info.js的内容用于测试（请注意，使用对勾创建.js文件也会保留文本文件中的换行符，因此您可以使用var.split（'\ n'）如果要使用数组，请在代码中输入）：

var Raw_Album_Info = `image1.jpg
image2.jpg
`

出于演示目的，我在顶部创建了一个albumList数组，在底部创建了一个脚本，以便显示带有变量内容的弹出窗口。我注释掉了警报，因为此演示不需要警报。我注释了 Raw_Album_Info =''，因为最初需要对其进行定义，以使 updatetest（）正常工作。

test.htm的内容，在Firefox中测试正常：

<script>
var albumList=["ipplr/","ipplr2/"] //my test paths

function Get_Slide_Show(Idx) {
  //Raw_Album_Info = '';          //do not set, leave as undefined
  //alert('Before: ' + Raw_Album_Info);
  albumPath = '/home/ken/temp/' + albumList[Idx];
  var script = document.createElement('script');
  script.src = albumPath + '/album_info.js';
  document.head.appendChild(script);
  //document.getElementsByTagName('head')[0].appendChild(script);
  //alert('After: ' + Raw_Album_Info);
}

function Load_Slide_Show(Idx) {
  Get_Slide_Show(Idx);
  Load_Album_Info();
}

function Init_Slide_Show() {
  Load_Album_List("photos");
  Load_Slide_Show(0);
  showSlides();
}
</script>

<script>
Get_Slide_Show(0)
updatetest()

function updatetest()
{
  if (typeof(Raw_Album_Info)=='undefined'){
    setTimeout('updatetest()',500)  //call back until defined
  }else{
    //you can alert, or just write to console to verify
    alert(Raw_Album_Info)
    console.log(Raw_Album_Info)
  }
}
</script>

在运行时插入Javascript，无法访问变量

2 个答案: