如何从另一个HTML窗口更改1个HTML窗口的背景图像?
|
作为此问题的标题sez:
如何从另一个HTML窗口更改1个HTML窗口的背景图像?
我有9个HTML窗口。
通过“ HTMLWindow_8”将它们称为“ HTMLWindow_0”和HTMLWindow_1。
HTML Window1具有背景图像和一组8个按钮。
每个按钮打开一个带有不同背景图像的新HTML窗口。
通过“ HTMLWindow_8”将其称为“ HMTLWindow_1”。
换句话说,“ HTMLWindow_0”上的Button–n创建了“ HTMLWindow_n”。
由“ HTMLWindow_0”上的按钮集创建的每个HTML窗口都有与之关联的背景图片。
背景图像x与HTMLWindow_x关联。
“ HTMLWindow_0”的HTML和Javascript位于名为“ HTMLWindow_0.html”的文件中。
“ HTMLWindow_1”至“ HTMLWindow_8”的HTML位于名为“ HTMLWindow_x.html”的文件中。
用作HTML窗口1至8的背景的图像的文件路径名集存储在文件“ HTMLWindow_0.html”中的Javascript数组“ Image_Array”中。
在HTMLWindow_0中对按钮单击起作用的HTML如下:
<div class=\"toc_button_01\"><button onClick=\"changePage (\'Toc 01\', 2)\"> </button></div>
<div class=\"toc_button_02\"><button onClick=\"changePage (\'Toc 02\', 4)\"> </button></div>
<div class=\"toc_button_03\"><button onClick=\"changePage (\'Toc 03\', 5)\"> </button></div>
<div class=\"toc_button_04\"><button onClick=\"changePage (\'Toc 04\', 6)\"> </button></div>
<div class=\"toc_button_05\"><button onClick=\"changePage (\'Toc 05\', 7)\"> </button></div>
<div class=\"toc_button_06\"><button onClick=\"changePage (\'Toc 06\', 8)\"> </button></div>
<div class=\"toc_button_07\"><button onClick=\"changePage (\'Toc 07\', 9)\"> </button></div>
<div class=\"toc_button_08\"><button onClick=\"changePage (\'Toc 08\', 10)\"> </button></div>
换句话说,点击8个按钮中的任何一个都会激活一个称为“更改页面”的JavaScript功能。
“更改页”如下所示:
function changePage (buttonName,
buttonNumber)
{
alert ( \"We\'re in the \'changePage\' function !\"
+ \"\\n\"
+ \"We just clicked on the \"
+ buttonName
+ \" button !\"
+ \"\\n\"
+ \"Button Number = \"
+ buttonNumber
+ \"\\n\"
+ \"Current Page URL = \"
+ Image_Array [buttonNumber]);
document.getElementById(\"image1\").src = Image_Array [buttonNumber];
generatePageContent (buttonNumber);
} // End of function changePage ()
“ changepage”又调用了另一个JavaScript函数“ generatePageContent”。
“ generatePageContent”是实际的JavaScript函数,它会根据在“ HTMLWindow_0”上按下了哪个按钮来创建新的HTML窗口1至8。
“ generatePageContent”看起来像这样:
function generatePageContent (buttonNumber)
{
alert ( \"We\'re in the \'generatePageContent\' function !\"
+ \"\\n\"
+ \"Button Number = \"
+ buttonNumber
+ \"\\n\"
+ \"Current Page URL = \"
+ Image_Array [buttonNumber]);
var newWindow = window.open (\' HTMLWindow_x.html \',
\'\',
\'width = 788, height = 632, left = 100, top = 200, toolbar = yes\');
newWindow.document.getElementById(\"image2\").src = Image_Array [buttonNumber];
} // End of function generatePageContent ()
创建新的HTML窗口1到8我没有问题。
换句话说,该行:
var newWindow = window.open (\' HTMLWindow_x.html \',
\'\',
\'width = 788, height = 632, left = 100, top = 200, toolbar = yes\');
Javascript函数“ generatePageContent”中的内容将创建HTML窗口1到8中的任何一个,具体取决于在“ HTMLWindow_0”上单击了按钮1到8的哪个。
但是这一行:
newWindow.document.getElementById(\"image2\").src = Image_Array [buttonNumber];
在Javascript函数“ generatePageContent”中不起作用。
这是应该在创建的HTML窗口1到8中更改背景图像的行。
它只是被忽略。
有趣的是,在调用HTML窗口“ HTMLWindow_0”中更改背景图片没有问题。
该行:
document.getElementById(\"image1\").src = Image_Array [buttonNumber];
在Javascript函数“ changepage”中可以很好地解决此问题。
所以,我想实际的问题是:
为什么 :
document.getElementById(\"image1\").src = Image_Array [buttonNumber];
在Javascript函数“更改页”中更改“ HTMLWindow_0”中的背景图片,但
newWindow.document.getElementById(\"image2\").src = Image_Array [buttonNumber];
Javascript函数“ generatePageContent”中的内容是否不会通过HTMLWindow_8更改任何“ HTMLWindow_0”中的背景图片?
JavaScript函数“ changePage”中的“ image1”引用是指文件HTMLWindow_0中的以下HTML代码:
<div class=\"img1\">
<img id = \"image1\"
src = \"../BookListPages/ClearingThePath/CTP-02.tiff\"
alt = \"Clearing The Path ...\"
width = \"765\"
height = \"580\"
border = \"2\"
/> <!-- End of img tag. -->
</div>
JavaScript函数“ generatePageContent”中的“ image2”引用是指文件HTMLWindow_x中的以下HTML代码:
<div class=\"img\">
<img id = \"image2\"
src = \"../BookListPages/NoSuchPageForThisBook.tif\"
alt = \"Clearing The Path ...\"
width = \"765\"
height = \"580\"
border = \"2\"
/> <!-- End of img tag. -->
换句话说,简而言之,我正在尝试使用创建窗口内的按钮从另一个HTML窗口内部创建一个HTML窗口,并且我想根据在哪个HTML按钮上单击来更改创建的HTML窗口的背景图像。创建窗口。
我在这里想念/想些什么?
我为这篇文章的复杂性表示歉意,但我想确保我已经清楚地解释了我要尝试做的事情,并且提供了所有支持我正在尝试的HTML和Javascript源代码在这里做。
最后,我想感谢大家为解决这个问题所能提供的任何建议,帮助,参考和建议。
没有找到相关结果
已邀请:
1 个回复
慰泥悍瓶
使用setTimeout有点告诉我这是一个'timing \'问题。这使我认为打开的窗口可能尚未加载。.调试过程的下一步可能使您意识到,应该使用newWindow.onload。 这是一个完整的工作示例: html1.html
html0.html