Динамическое изменение имени фреймов / фреймов

Я пытаюсь создать веб-сайт, на котором размещаются различные приложения (также веб-сайты) в iframe. Примечание: одновременно активно (отображается) только одно приложение. Моя проблема в том, что ссылки, которые полагаются на цели, загружаются в неправильный iframe (первый найденный).

Чтобы избежать проблем со ссылками, которые полагаются на конкретную цель, скрипт изменяет атрибут «имя» скрытых iframe на что-то другое и переименовывает текущий iframe в правильное имя/цель.

Но когда я нажимаю на ссылку, сайт загружается не в том фрейме.

Чтобы прояснить мою проблему, проверьте следующий код. Есть ссылки для активации одного из трех iframe (два других скрыты). Когда пользователь нажимает на ссылку sourceforge, страница должна загружаться в активный iframe (тот, который отображается в данный момент), но она загружается в первый (мс) 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>

person Adrian    schedule 22.10.2010    source источник


Ответы (1)


Существует обходной путь для вашего требования:

<!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>
person Community    schedule 22.10.2010
comment
вы правы, обходной путь работает. Это упрощенная версия моей реальной проблемы, и ваш обходной путь не помогает мне в моей ситуации. Тем не менее, спасибо за ответ! - person Adrian; 22.10.2010