Fatal编程技术网
  • javascript/
  • 在javascript第2部分中将背景色设置为变量

在javascript第2部分中将背景色设置为变量

javascript

在javascript第2部分中将背景色设置为变量,javascript,background-color,frameset,Javascript,Background Color,Frameset,我对JavaScript非常陌生，我有一个包含3个嵌套框架的网页（一个顶部框架，然后一个底部框架一分为二）。顶部框架名为Head，底部左侧框架名为LeftFrame，最后一个框架名为RightFrame。现在，LeftFrame是一个导航栏，我想让它成为这样，点击LeftFrame中的链接将改变头部的背景颜色。 这是主网页的代码： <HTML> <HEAD> <TITLE>Webcomics Review</TITLE> </HEAD>

我对JavaScript非常陌生，我有一个包含3个嵌套框架的网页（一个顶部框架，然后一个底部框架一分为二）。顶部框架名为Head，底部左侧框架名为LeftFrame，最后一个框架名为RightFrame。现在，LeftFrame是一个导航栏，我想让它成为这样，点击LeftFrame中的链接将改变头部的背景颜色。 这是主网页的代码：

<HTML>
<HEAD>
<TITLE>Webcomics Review</TITLE>
</HEAD>

<FRAMESET BORDER=0 ROWS="12%,*">
<FRAME NAME"Head" NORESIZE SRC="Head.html">

<FRAMESET BORDER=0 COLS="15%,*">
<FRAME NAME="LeftFrame" NORESIZE SRC="navigation.html">
<FRAME NAME="RightFrame" NORESIZE SRC="mainpage.html">
</FRAMESET>

</FRAMESET>
</HTML>


网络经济评论
这是导航栏的代码，它只有一个链接正在进行测试：

<HTML>
<HEAD>
<TITLE>Webcomics Review</TITLE>
<SCRIPT>
function setColor1(number)
{
    if (number==1)
    {
        parent.Head.document.body.style.backgroundColor=#FF0000;
    }
    return;
}
</SCRIPT>
</HEAD>
<BODY>
<CENTER>
<FONT SIZE=3 FACE=Haettenschweiler>Webcomics:
<BR><BR>
<A HREF="xkcd.html" TARGET="RightFrame" STYLE="text-decoration: none" onClick="setColor1(1)">Xkcd</A>
<BR><BR>
<A HREF="qc.html" TARGET="RightFrame" STYLE="text-decoration: none">Questionable Content</A>
<BR><BR>
<A HREF="qwantz.html" TARGET="RightFrame" STYLE="text-decoration: none">Dinosaur Comics</A>
<BR><BR>
<A HREF="survivingtheworld.html" TARGET="RightFrame" STYLE="text-decoration: none">Surviving the World</A>
<BR><BR>
</CENTER>
</BODY>
</HTML>


网络经济评论
函数setColor1（数字）
{
如果（数字==1）
{
parent.Head.document.body.style.backgroundColor=#FF0000；
}
回来
}
网络喜剧：
有没有人能告诉我我做错了什么，因为单击导航中的“xkcd”链接（我用来测试的链接）时，头部框架没有任何变化。

试试这个：

//MAIN FRAMES PAGE
<html>
<head>
<title>test</title>
<script type="text/javascript">
function setColor1(color)
{
    HEAD.document.body.style.backgroundColor=color;
    return;
}
window.setColor = function(a){setColor1(a);}
</script>
</head>
<FRAMESET BORDER=1 ROWS="12%,*">
<FRAME NAME="HEAD" NORESIZE SRC="frame_head.html" id="HEAD">
<FRAMESET BORDER=1 COLS="15%,*">
    <FRAME NAME="LeftFrame" NORESIZE SRC="frame_footer.html">
    <FRAME NAME="RightFrame" NORESIZE SRC="frame_body.html">
</FRAMESET>
</FRAMESET>
</html>
//END MAIN FRAMES PAGE
/**************************************************************************/
//BODY PAGE (RightFrame)
<html>
<head>
<title>test</title>
<script type="text/javascript">
function setColor(color)
{
    window.parent.setColor(color);
    return;
}
</script>
</head>
<body>
    <a href="#" onclick="setColor('#f00')">one</a>&nbsp;
    <a href="#" onclick="setColor('#0f0')">two</a>&nbsp;
    <a href="#" onclick="setColor('#00f')">three</a>&nbsp;
    <a href="#" onclick="setColor('#f0f')">four</a>&nbsp;
    <a href="#" onclick="setColor('#ff0')">five</a>&nbsp;
    <a href="#" onclick="setColor('#0ff')">six</a>&nbsp;
</body>
</html>
/**************************************************************************/

//主框架页面
测验
函数setColor1（颜色）
{
HEAD.document.body.style.backgroundColor=颜色；
回来
}
window.setColor=函数（a）{setColor1（a）；}
//结束主框架页面
/**************************************************************************/
//正文页（右框）
测验
函数setColor（颜色）
{
window.parent.setColor（颜色）；
回来
}
/**************************************************************************/
Ok的可能副本，这对更改其所在的框架很有效，但将目标从“document.body.style.backgroundColor”更改为“parent.Head.body.style.backgroundColor”对更改头部框架不起作用，将该功能移动到头部框架本身也不起作用。对此有什么建议吗？我没有得到你的最新答案，我把它作为一个单独的网页，而不是试图实现到一个我已经有了它。我将左框和头框作为空白HTML文档，将正文页保存到右框中，但是当我点击这些数字时，什么也没有发生。也许如果你能解释一下Javascript片段的功能以及它为什么被放在这里，我就能找出我缺少了什么。@Jon在主体页面中，我们调用了容器页面的
setcolor
函数（我们定义了框架），我认为这很简单。在容器页面中，我们定义了名为
setColor1
的函数，然后用
window.setColor=function（a）{setColor1（a）；}window.parent.setColor（color）它被传输到
setColor1（a）在容器框架中。好的。我和一个朋友一直在研究这个问题，我们使用函数setColor（color）{frames[“Head”].document.body.style.backgroundColor=color；frames[“LeftFrame”].document.body.style.backgroundColor=color；return；}