2010-10-22 7 views
0

J'essaie d'avoir un site Web qui héberge différentes applications (également des sites Web) dans les iframes. Remarque: une seule application est active (affichée) à la fois. Mon problème est que les liens qui dépendent des cibles sont chargés dans le mauvais iframe (le premier qui est trouvé). Pour éviter les problèmes avec les liens qui dépendent d'une cible spécifique, le script change l'attribut 'nom' des iframes cachées en quelque chose d'autre et renomme le iframe actuel en le nom/cible correct. Mais lorsque je clique sur un lien, le site se charge dans le mauvais cadre.Modifier le nom des iframes/cadres dynamiquement

Pour clarifier mon problème, consultez le code suivant. Il y a des liens pour activer l'un des trois iframes (les deux autres sont cachés). Lorsque l'utilisateur clique sur le lien sourceforge, la page doit être chargée dans l'iframe actif (celui qui est affiché à ce moment), mais elle est chargée dans le premier iframe (ms).

Y at-il un moyen de résoudre ce problème?

Utiliser 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> 

Répondre

0

Il existe une solution pour vos besoins:

<!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

vous avez raison, la solution de contournement fonctionne. Ceci est une version simplifiée de mon problème réel et votre solution de contournement ne m'aide pas dans ma situation. Encore, merci pour votre réponse! – Adrian

Questions connexes