Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1385 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Gestion automatique d'evenement ? CSS/Javascript

 



 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Gestion automatique d'evenement ? CSS/Javascript

n°1612928
Sn@kes
Posté le 19-09-2007 à 11:46:30  profilanswer
 

Bonjour tout le monde
J'aimerai savoir s'il est possible d'appeler une fonction javascript grace a des classes CSS sur des evenement types onkeyup, onchange, on blur .... ou par un moyen generique autre que CSS
 
Sous XUL il est possible de determiner le comportement d'un conteneur de classe X sur des evenements mais je n'ai pas trouvé d'equivalent pour IE. En gros je souhaiterai automatiser l'appel de la fonction appropriée pour chaque classe CSS.
 
Apres quelques tests voici une methode possible qui fonctionne pour IE7 et FF2. J'aimerai savoir s'il y a des ameliorations a apporter dessus.
 

Code :
  1. // Fonctions qui recupere les element en fonction de la valeur d'attribut
  2. function getElementsByAttribute;{
  3.      //voir http://javascript.internet.com/sni [...] ibute.html ; quelques modif necessaires pour compatibilité
  4. }
  5. //Ajoute les fonctions sur les evenement pour une classe
  6. function setEventOnClass(tag, valeur){
  7. var liste=getElementsByAttribute("*",tag, valeur);
  8. for (var i=0; i<liste.length; i++){
  9.  el=liste;
  10.  if (el.addEventListener) {
  11.   el.addEventListener ("blur", fonction_blur(el) ,false);
  12.   el.addEventListener ("change", fonction_change(el) ,false);
  13.   el.addEventListener ("keyup", fonction_keyup(el) ,false);
  14.  }
  15.  else if (el.attachEvent) {
  16.   el.attachEvent ("onblur", fonction_blur(el) );
  17.   el.attachEvent ("onchange", fonction_change(el) );
  18.   el.attachEvent ("onkeyup", fonction_keyup(el) );
  19.  }
  20.  else {
  21.   el.onblur=fonction_blur(el);
  22.   el.onchange=fonction_change(el);
  23.   el.onkeyup=fonction_keyup(el);
  24.  }
  25. }
  26. }
  27. //Ajoute les evenement pour une liste de classe en appelant [i]setEventOnClass pour chaque item de la liste
  28. function setEvent(liste){
  29. for(var i=0;i<liste.length; i++){
  30.  tag=liste[i][0];
  31.  valeur=liste[i][1];
  32.  setEventOnClass(tag, valeur);
  33. }
  34. }


 
Et pour charger les evenements sur les tag concernés on ajoute un onload
Exemple :

Code :
  1. ....
  2. <head>
  3.      <script language='javascript'>
  4.           var liste=new Array();
  5.           var classe_1= new Array("class", "classe_exemple_1" );
  6.           var classe_2= new Array("class", "classe_exemple_2" );
  7.           liste[0]= classe_1;
  8.           liste[1]= classe_2;
  9.      </script>
  10. </head>
  11. <body onload="setEvent(liste)";>
  12. ...
  13.      <INPUT id="CHAMP_TEST" type="text" class="classe_exemple_1">
  14.      <INPUT id="CHAMP_TEST_2" type="text" class="classe_exemple_2">
  15. ...


Message édité par Sn@kes le 20-09-2007 à 08:59:56
mood
Publicité
Posté le 19-09-2007 à 11:46:30  profilanswer
 

n°1613269
gebruik
Posté le 20-09-2007 à 07:21:13  profilanswer
 

Si tu veux que ça fonctionne partout, utilise plutôt une bibliothèque genre Prototype ou Dojo.
Au passage, la balise <header> n'existe pas ;-)


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Gestion automatique d'evenement ? CSS/Javascript

 

Sujets relatifs
Début en VBA : gestion des dépenseCode calendrier automatique en VBA
taille automatique d'un userform[C-DBUS] gestion des erreurs
Poblème de div + CSS avec IEProblème de rendu de CSS sous IE
Objet Webbrowser + javascript + blocage js local IE7Execution de progarmme en paralelle - gestion de memoire
Liste dérouolante avec Mysql et javascript(resolu)Programmation d'évenement pour un groupe de label créer dynamiquement
Plus de sujets relatifs à : Gestion automatique d'evenement ? CSS/Javascript


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR