Comment changer l'iframe src?

Donc sur ma page, je suis à l'aide d'une Iframe pour afficher une autre page web à l'intérieur. Je veux mettre en place un Tableau avec beaucoup de page web (autant que je veux) et je veux faire 2 boutons, de sorte que chaque fois que je clique sur le bouton Suivant, il va changer de page à l'intérieur de la balise iframe que j'ai. Ma question est comment puis-je configurer les 2 boutons (précédent et Suivant) donc, quand je clique dessus je vais le changer en conséquence de la Matrice de mettre en place ?

<html xmlns="w3.org/1999/xhtml">
  <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Untitled Document</title> 
  </head> 

  var webpageArray = new Array()
  webpageArray[0]= "web0.com/"; 
  webpageArray[1]= "web1.com/"; 
  webpageArray[2]= "web2.com/"; 

  <iframe id="myframe" src="web1.com"></iframe> 

  loadNextPage = function() { 
    var iframe = document.getElementById("myframe"); 
    var src = webpageArray[1]; 
    iframe.src = src; 
    return; 
  } 
  <body>  
    <a href="" onclick="LoadNextPage"> Next Web Page >> </a> 
  </body> 
  </html>
  • Si vous n'avez rien fait encore?
  • Si vous nous montrez votre code, nous pouvons vous aider à résoudre - s'il vous plaît ne pas nous faire de tout écrire à partir de zéro, il faut beaucoup plus d'efforts de notre part et vous en apprendrez rien de cette façon. Passer un peu de temps sur vous-même, vous devriez profiter de l'écriture de javascript, pas à l'éviter! Revenez quand vous avez un sérieux ou question spécifique ou modifier celui-ci en quelque chose de moins vague.
  • Votre code html/script n'est pas valide. Vous avez besoin de mettre le script dans un script de balises et ont l'iframe et le lien à l'intérieur du corps les tags
InformationsquelleAutor Maansahir | 2012-01-09
  1. 6

    Cela fonctionne - en utilisant un javascript et oui, une ligne handler - il doit être fixé dans le onload, mais nous allons prendre une chose à la fois

    DÉMO ICI

    <html>
  <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Untitled Document</title> 
    <script>
      var cnt=0,webpageArray = [
        "http://cnn.com/",
        "http://msn.com/", 
        "http://yahoo.com/"
      ]; 

      function loadNextPage(dir) {   
        cnt+=dir;
        if (cnt<0) cnt=webpageArray.length-1; //wrap
        else if (cnt>= webpageArray.length) cnt=0; //wrap
        var iframe = document.getElementById("myframe"); 
        iframe.src = webpageArray[cnt]; 
        return false; //mandatory!
      } 
    </script>
  </head> 

  <body>  
  <iframe id="myframe" src="http://cnn.com/"></iframe> 

  <a href="#" onclick="return loadNextPage(-1)"> << Previus Web Page </a> | 
  <a href="#" onclick="return loadNextPage(1)"> Next Web Page >> </a> 
  </body> 
  </html>

    la version jQuery

    DÉMO ICI

    var cnt=0,webpageArray = [
  "http://cnn.com/",
  "http://msn.com/", 
  "http://yahoo.com/"
]; 

$(document).ready(function() {
  $("#prev, #next").click(function(e) {
    cnt+=this.id=="next"?1:-1;
    if (cnt<0) cnt=webpageArray.length-1; //wrap
    else if (cnt>= webpageArray.length) cnt=0; //wrap
    $("#myframe").attr("src", webpageArray[cnt]);
    return false;
  });
});    

<iframe id="myframe" src="http://cnn.com"></iframe> <br />
<a href="#" id="prev"> << Previous Web Page </a> | 
<a href="#" id="next"> Next Web Page >> </a>
    • Mise à jour version unie pour avoir un lien précédent trop
    InformationsquelleAutor mplungjan
  2. 0

    Indésirable façon

    <html>
<head>
<script type="text/javascript">
flag = 0;
SrcList = new Array("http://www.google.com", "http://www.27nov.fr", "http://www.perdu.com");
function NextSrc(){
    if(flag < SrcList.length - 1){
    flag++;
    ChangeSrc(SrcList[flag]);
    }
    return false;
}
function PrevSrc(){
    if(flag > 0){
    flag--;
    ChangeSrc(SrcList[flag]);
    }
    return false;

}
function ChangeSrc(src){
    var iframe = document.getElementById('Myiframe');
    iframe.setAttribute('src',src);
}
</script>
</head>
<body>
<p><a href="#" onclick="PrevSrc()">Prev</a> - <a href="#" onclick="NextSrc()">Next</a></p>
<iframe id="Myiframe" src="http://www.w3schools.com" width="640" height="480">
</iframe>
</body>
</html>
    • Veuillez retourner faux sur le onclick gestionnaires! Pourquoi changer la source onload? Pourquoi faire appel à l'indice de drapeau? Il n'est pas un drapeau. Il n'y a pas de var appelé MaxLenght et si il y en avait, il sort maxLength ou il suffit d'utiliser la longueur du tableau Aussi, merci de lire w3fools.com
    • Comment puis-je faire rotrate en arrière quand j'arrive à la dernière page ? (merci d'éditer votre propre code)
    InformationsquelleAutor 27nov
  3. -2
    <iframe id="myframe" src="some web page"></iframe>

loadNextPage = function() {
    var iframe = document.getElementById("myframe");
    var src = webpageArray[2];
    iframe.src = src;
    return;
}

    Mais je ne recommande ce processus.

    • Où est le compteur et le changement de IDX et le codage des directions?
    • Le compteur n'est pas mon attention. La personne qui a posé cette question ont déjà mis en œuvre le code. OK ?
    • J'ai essayé de faire ce travail pour le dernier des couples de jours, mais il n'a tout simplement pas de travail pour moi 🙁 j'ai regardé de nombreux tutoriels et j'ai vraiment envie d'en savoir plus. De toute façon c'est ce que j'ai à ce jour avec votre aide, mais il ne fonctionne pas du tout (je sais je suis en manque beaucoup)
    • <html xmlns="w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Document sans titre</title> </head> var webpageArray = new Array() webpageArray[0]= "web0.com" webpageArray[1]= "web1.com" webpageArray[2]= "web2.com" <iframe id="myframe" src="web1.com"></iframe> loadNextPage = function() { var iframe = document.getElementById("myframe"); var src = webpageArray[1]; iframe.src = src; return; } <body> <a href="" onclick="LoadNextPage"> Next Web Page >> </a> </body> </html>
    • J'ai ajouté qu'à la question - mais il n'a pas de sens. Vous avez besoin des balises de script et de telles
    InformationsquelleAutor Acn