将图像数组从一个 window 传递到另一个，并在 javascript 中的新 window 中显示图像

Question

我遇到了一个奇怪的问题。我必须通过单击按钮将图像数组从一个 HTML window 传递到另一个。我传递的数组的名称是 compareImageArray，我已在 mainPage.html 中将其声明为全局变量。我在一个新的 window 中传递这个数组，如下所示：

 window.open('/comparePopup',compareImageArray,'_blank','popUpWindow', 'status=0,width=620,height=430,resizable=yes, scrollbars=yes, toolbar=yes')

在 comparePopup.html 中（即我要向其发送数组的新 window），我试图在 HTML 元素 pic1 中获取图像数组元素, pic2, pic3 这样:

<div id="comparePicDiv" style="display:block;">
    <img id="pic1">
    <img id="pic2">
    <img id="pic3">

我在 javascript 中这样做是这样的：

<script type="text/javascript">
// alert(compareImageArray[0])
compareImageArray = window.opener.compareImageArray;

var pic1= document.getElementById("pic1");
var pic2= document.getElementById("pic2");       
var pic3= document.getElementById("pic3");

pic1.src = compareImageArray[0];           
pic2.src = compareImageArray[1];
pic3.src = compareImageArray[2];

我可以在警报 alert(compareImageArray[0]) 中查看图像 url，这意味着 URL 已经来到此页面。但是，img 标签并未填充这些图像。这可能是什么原因？请帮忙。提前致谢。

Answer 1

在朋友的帮助下解决了这个问题。正如我所怀疑的那样，这不是因为我传递数组的方式。 compareImageArray 被声明为全局的，并在 comparePopup.html 中被完美检索，正如警报所确认的那样。

问题在于，由于图像是在 body onload 上加载的，而不是在任何按钮点击上加载的，所以我必须在 Javascript 之前声明图像元素（我没有这样做。）。结果，它无法识别 pic1、pic2 或 pic3 是什么。现在可以正常使用了！

将图像数组从一个 window 传递到另一个，并在 javascript 中的新 window 中显示图像

passing an Image array from one window to another and displaying the images in the new window in javascript

javascript

html

arrays

image

window