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 :

Afficher le nom de la div


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Inscrit en
    Septembre 2008
    Messages
    629
    Détails du profil
    Informations forums :
    Inscription : Septembre 2008
    Messages : 629
    Par défaut Afficher le nom de la div
    Bonjour

    Je suis à la recherche d'un code pour afficher le nom de la div lors d'un clic sur le nom en sachant que mon code est ceci:

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
             <li><a href="alsace.html"    target="myFrame"><div class="pays">Alsace</div></a></li>
             <li><a href="bretagne.html"  target="myFrame"><div class="pays">bretagne</div></a></li>
             <li><a href="Auvergne.html"  target="myFrame"><div class="pays">Auvergne</div></a></li>  
             <li><a href="France.html"    target="myFrame"><div class="pays">france</div></a></li>

    ex: si je clique sur Alsace j'ai le nom qui s'affiche sur ma page!...

    Je vous remercie de votre aide.

    Cordialement

    Max

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 208
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 208
    Par défaut
    Bonjour,
    sur quoi butes tu ?

    Sur l'événement onclick de l'élément tu récupères son contenu, innerHTML/textContent, et tu l'affiches dans un élément de ton choix appartenant à ton document en utilisant pareillement innerHTML/textContent.

  3. #3
    Membre éclairé
    Inscrit en
    Septembre 2008
    Messages
    629
    Détails du profil
    Informations forums :
    Inscription : Septembre 2008
    Messages : 629
    Par défaut
    Bonjour NoSmoking,

    sur quoi butes tu ?
    Sur un seul bouton pas trop de problème mais sur une liste de nom je n'arrive pas ???

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <button onclick="myFunction()">Paris</button>
     
    <p id="essai"></p>
     
    <script>
    function myFunction() {
        var x = document.getElementsByTagName("button")[0].textContent;
        document.getElementById("essai").innerHTML = x;  
    }
    </script>
    Une partie de ma liste des noms:

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
             <li id="Alsace">  <a href="alsace.html"    target="myFrame"><div class="pays">Alsace</div></a></li>
             <li id="bretagne"><a href="bretagne.html"  target="myFrame"><div class="pays">bretagne</div></a></li>
             <li id="Auvergne"><a href="Auvergne.html"  target="myFrame"><div class="pays">Auvergne</div></a></li>  
             <li id="france">  <a href="France.html"    target="myFrame"><div class="pays">france</div></a></li>

    Merci d'avance bonne journée

    Max

  4. #4
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 208
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 208
    Par défaut
    Je ne comprend pas bien ta démarche, je parle de la structure de ton document avec des <a> qui contiennent des <div> et des <button> en plus mais bon ...

    Qu'est ce qui t'empêche de récupérer TOUS tes éléments à traiter, tes <button>, et de leurs affecter une fonction sur leur événement onclick !

  5. #5
    Membre éclairé
    Inscrit en
    Septembre 2008
    Messages
    629
    Détails du profil
    Informations forums :
    Inscription : Septembre 2008
    Messages : 629
    Par défaut
    Salut NoSmoking,

    Qu'est ce qui t'empêche de récupérer TOUS tes éléments à traiter
    J'ai essayé je n'arrive pas je doit être un boulet?

    Bonne soirée

    max

  6. #6
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut


    Exemple :

    Code HTML : 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
    <!DOCTYPE html>
    <html lang="fr" dir="ltr">
    <head>
    	<!-- cache-control avec max-age=60 pour le développement uniquement -->
      <meta http-equiv="cache-control" content="public, max-age=60">
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
      <meta name="author" content="Daniel Hagnoul">
      <title>test</title>
      <style>
        * {
          box-sizing: border-box;
        }
                    
      </style>
      <script>
        'use strict';
                    
            
        document.addEventListener( "DOMContentLoaded", ev => {
                            
          // code du test
                            
                            
                            // fin code du test
          
        }, false );
        
        window.addEventListener( "load", ev => { 
                            
          // code du test
                            
                            const
                                    elemRegion = document.querySelector( "#region" ),
                                    arrElems = Array.from( document.querySelectorAll( "div.pays" ) );
                            
                            for ( const elem of arrElems ){
                                    elem.addEventListener( "click", ev => {
                                            elemRegion.value = ev.target.textContent;
                                    });
                            }
     
                            // fin code du test
                            
        }, false );
      </script>
    </head>
    <body>
    	<main>
    		<ul>
    			<li id="Alsace">  <a href="alsace.html"    target="myFrame"><div class="pays">Alsace</div></a></li>
    			<li id="bretagne"><a href="bretagne.html"  target="myFrame"><div class="pays">bretagne</div></a></li>
    			<li id="Auvergne"><a href="Auvergne.html"  target="myFrame"><div class="pays">Auvergne</div></a></li>  
    			<li id="france">  <a href="France.html"    target="myFrame"><div class="pays">france</div></a></li>
    		</ul>
    		<output id="region"></output>
    	</main>
    </body>
    </html>

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  7. #7
    Membre éclairé
    Inscrit en
    Septembre 2008
    Messages
    629
    Détails du profil
    Informations forums :
    Inscription : Septembre 2008
    Messages : 629
    Par défaut
    Bonjour Daniel

    Je te remercie beaucoup Nickel

    bonne journée

    Max

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

Discussions similaires

  1. Récupérer et afficher le nom d'utilisateur
    Par javelot69 dans le forum Access
    Réponses: 33
    Dernier message: 07/08/2006, 08h37
  2. afficher le contenu d'un div au clic sur un bouton
    Par mussara dans le forum Balisage (X)HTML et validation W3C
    Réponses: 10
    Dernier message: 10/07/2006, 17h37
  3. [WD10] Afficher les noms des colonnes
    Par devalender dans le forum WinDev
    Réponses: 4
    Dernier message: 24/02/2006, 14h38
  4. [Dates] [PHP/HTML/WEB] - Afficher le nom du jour dans la date
    Par fredhali2000 dans le forum Langage
    Réponses: 14
    Dernier message: 26/01/2006, 11h13
  5. Afficher le nom logique des cartes réseaux en VB?
    Par unarcher dans le forum VB 6 et antérieur
    Réponses: 3
    Dernier message: 20/10/2005, 17h56

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