IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Utilisation d'une variable Javascript en html


Sujet :

JavaScript

  1. #1
    Nouveau membre du Club
    Inscrit en
    Mai 2004
    Messages
    24
    Détails du profil
    Informations forums :
    Inscription : Mai 2004
    Messages : 24
    Points : 26
    Points
    26
    Par défaut Utilisation d'une variable Javascript en html
    Bonjour,

    Le but recherché est de réalisé un diaporama sur une page web statique. Le problème que je rencontre actuellement est le suivant:
    Peut-on récupérer la valeur contenu dans une variable en javascript et l'utiliser en html?
    Plus concretement, je n'arrive pas à récupérer la source de l'image qui est contenu dans variable javascript .
    Si quelqu'un à une idée je suis preneur!!

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
     
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http&#58;//www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Document sans nom</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <form name="form1" method="post" action="">
    <script language="JavaScript">
    	window&#91;num&#93;=1;
    	window&#91;nbr_photo&#93;=8;
    	window&#91;source&#93;="photo/1.jpg";	
     
    	function bonne_source&#40;&#41;
    	&#123;
    		var photo_source = new Array;
    		photo_source&#91;1&#93;="photo/1.jpg";
    		photo_source&#91;2&#93;="photo/2.jpg";
    		photo_source&#91;3&#93;="photo/3.jpg";
    		photo_source&#91;4&#93;="photo/4.jpg";
    		photo_source&#91;5&#93;="photo/5.jpg";
    		photo_source&#91;6&#93;="photo/6.jpg";
    		photo_source&#91;7&#93;="photo/7.jpg";
    		photo_source&#91;8&#93;="photo/8.jpg";
    		source=photo_source&#91;num&#93;;
    	&#125;
     
    	function prem_photo&#40;&#41; 
    	&#123;
    		num=1;
    		bonne_source&#40;&#41;;
    	&#125;
     
    	function pred_photo&#40;&#41; 
    	&#123;
    		if &#40;num != 1&#41;
    		&#123;
    		num=num-1;
    		bonne_source&#40;&#41;;
    		&#125;
    	&#125;
     
    	function suiv_photo&#40;&#41; 
    	&#123;
    		if &#40;num != nbr_photo&#41;
    		&#123;
    		num=num+1;
    		bonne_source&#40;&#41;;
    		&#125;
    	&#125;
     
    	function fin_photo&#40;&#41; 
    	&#123;
    		num=nbr_photo;
    		bonne_source&#40;&#41;;
    	&#125;
    </script>
    </head>
    <body>
      <div align="center">
        <p><img name="Photo" src=??? width="640" height="480" alt="" style="background-color&#58; #00FFCC"></p>
        <p><label>truc</label>&nbsp;</p>
        <p>
          <input name="prem" type="submit" id="prem" value="D&eacute;but" onClick="prem_photo&#40;&#41;;">
          <input name="pred" type="submit" id="pred" value="Pr&eacute;cedent" onClick="pred_photo&#40;&#41;;">
          <input name="suiv" type="submit" id="suiv" value="Suivant" onClick="suiv_photo&#40;&#41;;">
          <input name="fin" type="submit" id="fin" value="Fin" onClick="fin_photo&#40;&#41;;">
        </p>
      </div>
    </form>
    </body>
    </html>
    Merci d'avance

  2. #2
    Expert éminent

    Avatar de denisC
    Profil pro
    Développeur Java
    Inscrit en
    Février 2005
    Messages
    4 050
    Détails du profil
    Informations personnelles :
    Âge : 44
    Localisation : Canada

    Informations professionnelles :
    Activité : Développeur Java
    Secteur : Service public

    Informations forums :
    Inscription : Février 2005
    Messages : 4 050
    Points : 7 641
    Points
    7 641
    Par défaut
    Dans ta fonction bonne_source, il faut changer l'attribut source de ton élement HTML img.

    Pour cela, affecte lui un id (un nom unique), et fais:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.getElementById&#40;'idImage'&#41;.src=source;
    Pense à executer la fonction une première fois au chargement de la page, ou initialise l'attribut src de ton document à ta première photo.

    Bonne chance.

  3. #3
    Expert éminent Avatar de Mr N.
    Profil pro
    Inscrit en
    Septembre 2004
    Messages
    5 418
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Septembre 2004
    Messages : 5 418
    Points : 6 449
    Points
    6 449
    Par défaut
    Essaie un truc du genre :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    var diap = new Image;
    diap.src = 'photo/1.jpg';
    puis

  4. #4
    Nouveau membre du Club
    Inscrit en
    Mai 2004
    Messages
    24
    Détails du profil
    Informations forums :
    Inscription : Mai 2004
    Messages : 24
    Points : 26
    Points
    26
    Par défaut
    Le problème persiste, je n'arrive pas à changer de diapo à l'aide des boutons!! Peut être ai-je fait aussi une erreur à ce nivo!!

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. utiliser une variable javascript globale dans un fichier html
    Par Nico_SAS dans le forum Général JavaScript
    Réponses: 6
    Dernier message: 09/03/2012, 16h02
  2. utiliser une variable javascript en html
    Par walido dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 09/10/2009, 19h19
  3. Réponses: 7
    Dernier message: 05/01/2008, 20h37
  4. Inserer la valeur d'une variable Javascript au milieu d'une source HTML
    Par drizztoli dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 09/10/2007, 16h47
  5. passage d'une variable javascript dans du html
    Par the_ugly dans le forum Général JavaScript
    Réponses: 7
    Dernier message: 01/02/2006, 17h08

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo