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 de la méthode AddEventListener()


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre chevronné
    Avatar de Rony Rauzduel
    Homme Profil pro
    En formation Architecte logiciel
    Inscrit en
    Décembre 2008
    Messages
    638
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : En formation Architecte logiciel
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2008
    Messages : 638
    Par défaut Utilisation de la méthode AddEventListener()
    Bonjour à toutes et à tous,

    Dans le code html suivant :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    <html>
     
        <head>
            <title>Prototype - Interface connexion des agents</title>
            <script src="scripts/verif.js" type="text/javascript"></script>
        </head>
        <body bgcolor="white">
          <form id="demoForm">
    		<input id="button" value="Button" type="button">
    	</form>
        </body>
    </html>
    si je place le code javascript suivant :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
     
    		if (document.body.addEventListener) {
    			document.getElementById("demoForm").addEventListener("click", function(){alert("button clicked");}, false);
    		}
    		else if (document.body.attachEvent)
    		{
      			alert("Your browser does not support addEventListener");
    		}
    Le script fonctionnne et la fenêtre s'affiche avec le message souhaité; par contre si je place le code dans le fichier verif.js
    pour respecter l'aspect unobstrusive de Javascript et dissocier le
    script et le balisage HTML cela ne fonctionne pas.

    En fait rien ne se passe comme si mon gestionnaire d'évènement
    n'était pas pris en compte.

    J'utilise Firefox 3.5.11 sous Linux.

    Merci d'avance.
    Transact.

  2. #2
    Expert éminent

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Par défaut
    Bonjour,

    Quand vous dites que vous mettez le script dans la page, vous le mettez à quel endroit ? Après le HTML ou avant ? Car dans votre seconde version, le fichier verif.js est appelé avant que le code HTML ne soit créé. Or ce javascript utilise le code HTML.
    Ou bien... vous avez laissé les balises <script> dans le .js ?

  3. #3
    Membre chevronné
    Avatar de Rony Rauzduel
    Homme Profil pro
    En formation Architecte logiciel
    Inscrit en
    Décembre 2008
    Messages
    638
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : En formation Architecte logiciel
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2008
    Messages : 638
    Par défaut
    Je place le script juste après la balise </form>.
    C'est une erreur de ma part, j'ai laissé les balises scripts dans
    le fichier verif.js, mais même sans cela ne marche pas.

  4. #4
    Expert éminent

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Par défaut
    Oui, c'est bien ce que je dis, vous appelez le script avant que le HTML ne soit créé. Donc le script ne retrouve pas ce qu'il cherche.

    Placez le code js dans une fonction nommée par exemple init().
    Ensuite, appelez cette fonction dans le onload du body:

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <body onload="init();">

  5. #5
    Membre chevronné
    Avatar de Rony Rauzduel
    Homme Profil pro
    En formation Architecte logiciel
    Inscrit en
    Décembre 2008
    Messages
    638
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : En formation Architecte logiciel
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2008
    Messages : 638
    Par défaut
    Quitte à me répéter, j'aurai souhaité que le Javascript soit unobstrusive donc pas de Javascript dans le HTML ...

    pas de ça
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    <body onload="init();">

  6. #6
    Expert éminent

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Par défaut
    Quitte à me répéter, si vous ne faites pas comme ça, vous ne serez pas certain que le code HTML soit complètement généré lorsque vous appelerez le script.

    Cette version-ci vous sied-t-elle mieux ?

    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
    <html>
     
        <head>
            <title>Prototype - Interface connexion des agents</title>
            <script src="scripts/verif.js" type="text/javascript"></script>
        </head>
        <body bgcolor="white">
          <form id="demoForm">
    		<input id="button" value="Button" type="button">
    	</form>
        </body>
    </html>
     
    <script type="text/javascript">
    init();
    </script>

    Ca ne change quasi rien à votre script d'origine. Mais bon, le script est en dehors du HTML...

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

Discussions similaires

  1. Réponses: 4
    Dernier message: 10/04/2007, 16h26
  2. Réponses: 20
    Dernier message: 19/09/2006, 20h52
  3. Utilisation de la méthode FIND
    Par Jeannot45 dans le forum Access
    Réponses: 3
    Dernier message: 09/01/2006, 15h41
  4. [Ant] Utilisation de la méthode clone()
    Par Shabata dans le forum ANT
    Réponses: 1
    Dernier message: 01/12/2005, 15h01
  5. [Select()/Focus()] Pb dans l'utilisation de ces méthodes
    Par Kylen dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 23/06/2005, 14h54

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