文章/答案/技术大牛

发布

社区首页 >问答首页 >动态更改iframe/frame的名称

问动态更改iframe/frame的名称
EN

Stack Overflow用户

提问于 2010-10-22 22:15:13

回答 1查看 2.8K关注 0票数 1

我正在尝试有一个网站，托管不同的应用程序(也包括网站)在iframes。注:一次只有一个应用程序处于活动(显示)状态。我的问题是依赖于目标的链接被加载到错误的iframe中(找到的第一个)。

为了避免依赖于特定目标的链接出现问题，该脚本将隐藏iframe的属性“name”更改为其他属性，并将当前iframe重命名为正确的名称/目标。

但是当我点击一个链接时，网站加载到了错误的框架中。

要澄清我的问题，请查看以下代码。有一些链接可以激活三个iframe中的一个(其他两个是隐藏的)。当用户单击sourceforge链接时，页面应该被加载到活动的iframe (当时显示的那个)中，但它被加载到第一个(ms) iframe中。

有没有办法解决这个问题？

使用Firefox 3.6.11/Windows 7

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function activate(n){
    var iframes = document.getElementsByTagName('iframe');
    for(var i = 0; i < iframes.length; i++){
        var f = iframes[i];
        f.style.display = 'none';
        f.name = 'hidden-'+i;
    }
    document.getElementById('target'+n).style.display = 'inline';
    document.getElementById('target'+n).name = 'target';
}
</script>
</head>
<body>
<h1>Willkommen</h1>

<a href="http://sourceforge.net/" target="target">Load Sourceforge in current frame</a>
<br/>
<a href="javascript:activate(1);">MICROSOFT</a>
<a href="javascript:activate(2);">GOOGLE</a>
<a href="javascript:activate(3);">ORACLE</a>

<iframe id="target1" src="http://www.microsoft.com/" name="target" width="100%" height="400px">noframes</iframe>
<iframe style="display:none;" id="target2" src="http://www.google.com/" name="hidden-1" width="100%" height="400px">noframes</iframe>
<iframe style="display:none;" id="target3" src="http://www.oracle.com/" name="hidden-2" width="100%" height="420px">noframes</iframe>

</body>
</html>

html

dhtml

frames

target

javascript

回答 1

Stack Overflow用户

发布于 2010-10-22 22:35:31

对于您的需求，有一个解决方法：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function activate(n){
    var iframes = document.getElementsByTagName('iframe');
    for(var i = 0; i < iframes.length; i++){
        var f = iframes[i];
        f.style.display = 'none';
        f.name = 'hidden-'+i;
    }
    document.getElementById('target'+n).style.display = 'inline';
    document.getElementById('target'+n).name = 'target';
}

function loadInActive(aTag) {
    var iframes = document.getElementsByTagName('iframe');
    for(var i = 0; i < iframes.length; i++){
        var f = iframes[i];
        if(f.style.display == "inline") {
            f.src = aTag.href;
        }
    }
}
</script>
</head>
<body>
<h1>Willkommen</h1>

<a href="http://sourceforge.net/" target="target" onclick="loadInActive(this);return false;" >Load Sourceforge in current frame</a>
<br/>
<a href="javascript:activate(1);">MICROSOFT</a>
<a href="javascript:activate(2);">GOOGLE</a>
<a href="javascript:activate(3);">ORACLE</a>

<iframe id="target1" src="http://www.microsoft.com/" name="target" width="100%" height="400px">noframes</iframe>
<iframe style="display:none;" id="target2" src="http://www.google.com/" name="hidden-1" width="100%" height="400px">noframes</iframe>
<iframe style="display:none;" id="target3" src="http://www.oracle.com/" name="hidden-2" width="100%" height="420px">noframes</iframe>

</body>
</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/3997674

复制

相似问题

问动态更改iframe/frame的名称
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问动态更改iframe/frame的名称EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问动态更改iframe/frame的名称
EN