Ouvrir les liens dans l'iframe un par un lorsque le bouton est enfoncé
P粉949848849
2023-09-03 15:44:43
<p>J'ai un tableau avec trois liens pour un bouton utilisé dans le pied de page et lorsque j'appuie encore et encore sur le bouton, le tableau fonctionne correctement un par un. . Et un bouton de lien apparaîtra à chaque fois que vous appuierez sur celui-ci. C'est très bien.
Mais je veux, lorsque je clique sur le bouton, <em> que le "lien" s'ouvre dans un "iframe" </em>. . . J'ai utilisé du code iframe pour leur transmettre l'identifiant du bouton src= mais cela ne fonctionne pas. . Veuillez fournir le code ci-dessous et aider. .
.
Mon code de bouton avec array</p>
<pre class="brush:php;toolbar:false;"><!DOCTYPE html>
<html>
<tête>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
. bas de page {
poste : fixe ;
gauche : 0 ;
bas : 0 ;
largeur : 100 % ;
couleur de fond : rouge ;
Couleur blanche;
alignement du texte : centre ;
}
</style>
<script>
laissez lien = nouveau tableau()
lien[0] = "https://www. clc-uk. org. Royaume-Uni/cms/cms. jsp?menu_id=26131&postcode=AL3+8QE&distance=20"
lien[1] = "https://www. clc-uk. org. Royaume-Uni/cms/cms. jsp?menu_id=26131&postcode=AL5+3NG&distance=20"
lien[2] = "https://www. clc-uk. org. Royaume-Uni/cms/cms. jsp?menu_id=26131&postcode=AL4+3NS&distance=20"
laissez intlinkIndex = 0;
fonction writeLink() {
if (intlinkIndex >= lien.longueur) {
soit btn = document. getElementById('btn');
btn. style. display = 'aucun';
mon lien. style. display = 'aucun';
}
document. getElementById('monlien'). innerHTML = '<a href="' + lien[intlinkIndex] + '">' + lien[intlinkIndex] + '</a>';
intlinkIndex++;
}
</script>
≪/tête>
<corps>
<div class="pied de page">
<id du bouton="btn" onclick="writeLink();">Cliquez sur moi</bouton>
<div id="monlien"></div>
<br>
<iframe id="iframe" src="monlien" largeur="100%" hauteur="400"></iframe>
</div>
</corps>
</html></pre></p>
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Lors de la génération du HTML du lien, vous pouvez l'obtenir en spécifiant le nom de l'iframe dans
target.Alors ajoutez un attribut
nameà votre iframe comme ceci :Ajoutez ensuite un attribut
target.document.getElementById('mylink').innerHTML = '<a href="' + link[intlinkIndex] + '" target="iframe">' + link[intlinkIndex] + '</a>';function writeLink() { if (intlinkIndex >= link.length) { let btn = document.getElementById('btn'); btn.style.display = 'none'; mylink.style.display = 'none'; } document.getElementById('mylink').innerHTML = '<a href="' + link[intlinkIndex] + '">' + link[intlinkIndex] + '</a>'; document.getElementById('iframe').src = link[intlinkIndex]; intlinkIndex++; }Code source complet
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> .footer { position: fixed; left: 0; bottom: 0; width: 100%; background-color: red; color: white; text-align: center; } </style> <script> let link = new Array() link[0] = "https://www.clc-uk.org.uk/cms/cms.jsp?menu_id=26131&postcode=AL3+8QE&distance=20" link[1] = "https://www.clc-uk.org.uk/cms/cms.jsp?menu_id=26131&postcode=AL5+3NG&distance=20" link[2] = "https://www.clc-uk.org.uk/cms/cms.jsp?menu_id=26131&postcode=AL4+3NS&distance=20" let intlinkIndex = 0; function writeLink() { if (intlinkIndex >= link.length) { let btn = document.getElementById('btn'); btn.style.display = 'none'; mylink.style.display = 'none'; } document.getElementById('mylink').innerHTML = '<a href="' + link[intlinkIndex] + '">' + link[intlinkIndex] + '</a>'; document.getElementById('iframe').src = link[intlinkIndex]; intlinkIndex++; } </script> </head> <body> <div class="footer"> <button id="btn" onclick="writeLink();">Click Me</button> <div id="mylink"></div> <br> <iframe id="iframe" src="mylink" width="100%" height="400"></iframe> </div> </body> </html>