首页 文章

如何使用另一帧更改一帧的背景颜色？

提问于
浏览 次
-1

我知道框架已被弃用，但我需要使用它们 .

我有3帧;上框架，下框架和下框架 . 所有帧链接到另一个html文件 . 我应该在html文件中放置lowrightframe来改变lowerleftframe的背景颜色？

如在，用户按下右下框架中的按钮，它改变左下框架的颜色 .

这是我到目前为止（使用JS）

function changeBGColor (newColor)
{
     document.getElementById("lowerleftframe").style.bgColor=newColor;
}

这是按钮 .

<button type="button" onclick="changeBGColor('white')">Change Color</button>
javascript html css colors frames

1 回答

  • 0

    好的，这里有很多警告是一个解决方案 . 请记住，所有html文件都应位于同一个域中 . 站点/文件应该在某种类型的Web服务器上提供，例如localhost（至少在chrome中） . 出于安全原因，来自不同域或来自file：//的文件将抛出跨源限制错误 .

    顶部框架集页面... index.html：

    <html>
<frameset cols="50%, 50%">
    <frame src="left.html" name="leftF"></frame>
    <frame src="right.html" name="rightF"></frame>
</frameset>
</html>

    右框架的html ... right.html

    <html>
<head></head>
<body>
    <h1>Righty</h1>
</body>
</html>

    左框架的html和javascript改变了右框架的颜色... left.html

    <html>
<head>
    <script>
        function changeColor() {
            var f = parent.frames["rightF"];
            f.document.body.style.backgroundColor = "red";
        }
    </script>
</head>
<body>
    <h1>Lefty</h1>
    <button type="button" onclick="changeColor()">Change Color</button>
</body>
</html>

    从一帧更改另一帧颜色的实际代码是：

    var f = parent.frames["rightF"];
f.document.body.style.backgroundColor = "red";

    其中“rightF”是右框架的名称 . 和parent是框架集 . 我们向父级迈出一步，然后访问具有给定名称的帧，然后更改它的body.style .

    回复于

相关问题