11528 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous.

Je fais actuellement une appli web qui comporte beaucoup de formulaire de saisie.

Pour qu'ils soient plus conviviaux, j'utilise le pseudo style css :hover sur les champs texte pour changer le fond du champ, ce qui permet plus facilement à l'utilisateur de répérer quel champ à le focus.

Le problème est qu'ie ne reconnais le :hover que sur les liens. J'ai donc fais un script qui applique un changement de class aux champs texte sur les événements onfocus et onblur. Je charge ce script au chargement de la page et ça marche très bien.

Le soucis, c'est que si j'ai besoin de redéfinir l'évenement onblur ou onfocus sur un champ, je perds le code qu'il y avait avant. Ce que je voudrais faire c'est pouvoir récupérer le code qui est existe dans l'événement, le réutiliser et mettre du code en plus.

Exemple avec mon champ toto:
Sur l'événement onfocus il y a le code suivant:
toto.onfocus=function(){alert("1");}

je voudrais redéfnir l'événement onfocus :
toto.onfocus=function(){
récupération et application du code précédent
alert("2");
}


Merci d'avance pour vos réponses
Modifié par pitivier (25 Jan 2006 - 10:41)
Bonjour
pitivier a écrit :
Bonjour à tous.

Exemple avec mon champ toto:
Sur l'événement onfocus il y a le code suivant:
toto.onfocus=function(){alert("1");}

je voudrais redéfnir l'événement onfocus :
toto.onfocus=function(){
récupération et application du code précédent
alert("2");
}


Merci d'avance pour vos réponses

toto.onfocus=function(){alert("1");alert("2");}


Ou tu utilise un script d'émulation :hover pour IE
merci de ta réponse.

J'utilise déjà un script d'émulation pour ie.


Mais ce que je veux en fait c'est pouvoir définir un évenement sur un champ.

Et ensuite redéfinir l'événement sur ce même champ mais en récupérant le premier code.

Si je définit sur l'événement click d'un bouton le code :
alert("1");

Si je redéfinit sur l'événement click d'un bouton le code :
alert("2");

Lorsque je vais cliquer sur ce bouton, il n'y aura que
alert("2") 
qui sera executé, moi je veux executer
alert("1");
alert("2");
Bonjour,
Le plus simple est que tu utilises le système d'évènement standard à l'aide des fonctions :
attachEvent (pour IE) et addEventListener (pour les autres).

Voici des liens vers ma référence js personnelle :
addEventListener et attachEvent.
Bonjour,

Je n'avait pas compris que tu voulais ajouter un évènement sur un objet sans écraser le précédent.
Fonction DHTML pour concrétiser l'info de QuentinC :

function addEvent(obj,evType,fn,capt){ 
  if(obj.addEventListener){
    obj.addEventListener(evType,fn,capt);return true;} // NS6+ 
  else if(obj.attachEvent)obj.attachEvent("on"+evType,fn) // IE 5+ 
  else {
   return false;
  } 
} 

Modifié par chmel (20 Jan 2006 - 09:19)
J'ai aussi une autre technique beaucoup plus brutale, mais inutile et franchement lourde pour le cas présenté ici.
Modifié par QuentinC (20 Jan 2006 - 10:33)
Administrateur
pitivier a écrit :
Je vous remercie,

c'est exactement ça dont j'avais besoin.

Merci encore.

Bravo, le problème est donc [Résolu] ? Smiley cligne
Vous allez me trouver pénible,

mais je viens de m'apercevoir d'un pb avec ie.
Quand j'ajoute plusieurs fonctions sur le même événement d'un objet, celles-ci sont appelée dans un ordre aléatoire :

addEvent(obj,"click",test1,false);
addEvent(obj,"click",test2,false);
addEvent(obj,"click",test3,false);
addEvent(obj,"click",test4,false);


Les fonctions ne sont pas appelée toujours dans le même ordre, alors que sur ff pas de souçis.
pitivier a écrit :
comment faire dans ce cas pour que l'ordre soit respecté?

avec des conditions Smiley lol
Si tu nous donnais tu projet complet avec code plutôt que des bribes, on pourrait "p'têt " trouver une solution avant la 3ème page Smiley langue
Modifié par chmel (20 Jan 2006 - 15:54)
Excusez-moi si les infos ne sont pas très claires Smiley confused .

En fait j'ai une appli web à faire composée de nombreux écrans.
Je veux pouvoir appliquer des fonctions sur certains événements de mes champs de saisies. Par exemple changer le style du champ qui à le focus.

Je vais donc mettre ce code dans un fichier .js qui sera lié à toutes les pages de mon appli.

Mais dans certains cas, il faudra faire encore d'autre chose sur les événements aux quels j'aurais déjà lié des fonctions.

Je veux donc pouvoir ajouter des fonctions sur un événement (focus par exemple), mais que l'ordre des appels soit respecté.
Pour obliger les fonctions à s'effectuer dans l'ordre:
Une variable globale contenant le nombre de clicks effectué sur l'objet :

nbClic=0
function test1(){
  if(nbClick==0){instructions1;nbClick++}
  }
function test2(){
  if(nbClick==1){instructions2;nbClick++}
  }

et ainsi de suite...
pitivier a écrit :
Par exemple changer le style du champ qui à le focus.
ça doit pouvoir se faire en css.

Pour obliger les fonctions à s'effectuer dans l'ordre:
Une variable globale contenant le nombre de clicks effectué sur l'objet :

nbClic=0
function test1(){
  if(nbClick==0){instructions1;nbClick++}
  }
function test2(){
  if(nbClick==1){instructions2;nbClick++}
  }

et ainsi de suite...
chmel a écrit :
ça doit pouvoir se faire en css.

Non, justement, son but est de l'adapter pour IE...