【问题标题】:Beginner JavaScript/HTML Frame Communication初学者 JavaScript/HTML 框架通信
【发布时间】:2013-09-15 21:57:35
【问题描述】:

我的网页设计课程的一项任务是创建一个页面,其中两个框架使用 JavaScript 进行通信。下框架 (lower2.html) 上有四个链接,单击时,它们应该将上框架 (upper1.html) 中的图像更改为相应的图像,但没有。这是我所拥有的:

文件名:js-seventeen.html。这是我执行的。

<HTML>
<HEAD>
<TITLE>HTML and JavaScript</TITLE>
</HEAD>
<FRAMESET ROWS="140,*">
<FRAME NAME="upperFrame" SRC="upper1.html">
<FRAME NAME="lowerFrame" SRC="lower2.html">
</FRAMESET>
</HTML>

文件名:upper1.html。这是显示图像的上框。

<HTML>
<HEAD>
<TITLE>HTML and JavaScript</TITLE>
</HEAD>
<BODY>
<CENTER>
<IMG NAME="upperImage" SRC="lions.gif">
</CENTER>
</BODY>
</HTML>

文件名:lower2.html。这是包含应该更改图像但不更改图像的链接的下部框架。无论我点击什么,它都会保留在默认的 lions.gif 上。

<HTML>
<HEAD>
<TITLE>HTML and JavaScript</TITLE>
<SCRIPT>
function setImage(number)
{
if (number==1)
{
    parent.upperFrame.document.upperImage.src="lions.gif";
}
if (number==2)
{
    parent.upperFrame.document.upperImage.src="tigers.gif";
}
if (number==3)
{
    parent.upperFrame.document.upperImage.src="bears.gif";
}
if (number==4)
{
    parent.upperFrame.document.upperImage.src="ohmy.gif";
}
return;
}
</SCRIPT>
</HEAD>
<BODY>
<CENTER>
<H2>IMAGE LIST</H2>
<TABLE>
<TR><TD><A HREF="javascript:setImage(1)">1: LIONS.GIF</A></TD></TR>
<TR><TD><A HREF="javascript:setImage(2)">2: TIGERS.GIF</A></TD></TR>
<TR><TD><A HREF="javascript:setImage(3)">3: BEARS.GIF</A></TD></TR>
<TR><TD><A HREF="javascript:setImage(4)">4: OHMY.GIF</A></TD></TR>
</TABLE>
</CENTER>
</BODY>
</HTML>

我浏览了这本书,据我所知,我做的一切都正确。提前感谢您的帮助。

【问题讨论】:

  • 看起来像20世纪的东西,我为你感到遗憾。框架在称为框架的窗口对象集合中,所以尝试类似 parent.frames['upperframe'].document.images[0].src - 我不确定它是否会工作,只是尝试 - 因为这现在完全没用了过时的东西。
  • 它不起作用,但还是谢谢。我意识到良好的设计实践通常是避免使用框架,但是我从一本书中得到教导,这本书告诉我我可以使用 Netscape 搜索信息,并解释了 Oracle、Sun 和 Microsoft 如何与它竞争以生产最好的浏览器。 :)
  • 如果你有能力购买一些新的东西并且你想做网页设计 - 投资书籍,如果你只需要学分就可以了;)

标签: javascript html communication frames


【解决方案1】:

JavaScript 主要在 ID 中工作。 top 为您提供主窗口。

为框架和图像标签添加 ID 属性

<frame id="upperFrame" name="upperFrame" >

您也可以按索引访问帧

 top.frames[0].document.  ,,,

阅读 www.w3schools.com 的资料。在 HTML5 中还取消了框架集,因此请考虑学习 iframe

也为框架和图像分配 ID,使 ID 与名称相同,然后尝试这样的操作

 top.frames["upperFrame"].document.getElementById["imageIdNotName"].src = 'new value';

【讨论】:

猜你喜欢
  • 2022-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-04-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2022-01-15
  • 2013-05-16
相关资源
最近更新 更多