onkeyup : rajouter des fonctions

Version imprimable

12/04/2012, 15h22
skyser

onkeyup : rajouter des fonctions
Bonjours et merci pour l'aide que vous pourrez m'apporter. alors voilà je vous expose mon problème.

en JavaScript je fais :
Code:

1 2 3 4 5 6 7 8 9 element.onkeyup = function(){ // code } // puis si besoin je refais element.onkeyup = function(){ // code différent }
Mon problème c est que sa écrase mon ancien onkeyup !
et j'aimerai qu'il face appelle au deux fonctions.

Mes contraintes :
je ne peux pas en html taper onkeyup = "funct1(); funct2()"
et je ne peux pas fusionner non plus les deux functions

Voilà merci pour toute votre aide d'avance !

________________________________________________

j'oubliais, j'ai testé
Code:

1 2 3 4 5 6 7 8 9 element.onkeyup = function(){ // code } // puis si besoin je refais element.onkeyup += function(){ // code différent }
Et sa ne marche pas ... mais se serrait dans cette idée que j'aimerai que la solution se porte :)

merci à vous

J'aurais tenté ça

Code:

1
2
3
4
5
foo = element.onkeyup
 
element.onkeyup= function(){foo();
                          //ici ton nouveau code
}

12/04/2012, 16h04
skyser

oui mais la sa reviens a fusionné :) et sa me plai pas trop ! enfin c est pas trop approprié a ce que je veux faire.
12/04/2012, 16h06
SpaceFrog
passe par jquery ...
il les ajoute
Code:

1 2 $('#elem').click(function(){alert('hello')}) $('#elem').click(function(){alert('bonjour')})
le code de jquery procède selon la methode donnée au dessus ...

sinsion en js pur

Code:

1
2
3
4
5
6
7
8
9
elem =document.getElementById('foo')
if (elem.addEventListener){
	elem.addEventListener('click', function(){alert('un')})
	elem.addEventListener('click', function(){alert('deux')})
	}
if (elem.attachEvent){	
	document.getElementById('foo').attachEvent('onclick', function(){alert('trois')})
	document.getElementById('foo').attachEvent('onclick', function(){alert('quatre')})
}

12/04/2012, 16h38
skyser

c'est quoi la différence entre les deux if ?
12/04/2012, 16h42
SpaceFrog

Le navigateur

Code:

1
2
3
4
5
6
7
8
9
elem =document.getElementById('foo')
if (elem.addEventListener){
	elem.addEventListener('click', function(){alert('un')})
	elem.addEventListener('click', function(){alert('deux')})
	}
if (elem.attachEvent){	
	document.getElementById('foo').attachEvent('onclick', function(){alert('trois')})
	document.getElementById('foo').attachEvent('onclick', function(){alert('quatre')})
}

Ce code ne marche pas, et c est celui qui m’intéresse le plus :(
j'ai rajouté des ; mais sa ne marche pas non plus :(

12/04/2012, 17h11
SpaceFrog

les ; ne sont pas le souci ...

tu as un element avec un id ="foo" sur ta page ... ???
12/04/2012, 17h17
Willpower

remarque, c'est toujours mieux de mettre un else entre les if, je ne sais pas si ça existe des navigateurs qui possèdent les 2 mais dans le doute, sinon tu risques de te retrouver avec 2 appels à la même fonction. (surtout que même si le gestionnaire d'évent est bien foutu sur le navigateur en question et qu'il détecte la même fonction, ici les fonction sont distinctes car déclaré sur le moment).

(je sais que chrome par exemple, reprend beaucoup de méthodes d'IE ET de FIREFOX pour étendre au maximum sa compatibilité).

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<html>
	<head>
		<title>test</title>
	</head>
 
	<body>
		<a id="foo" > ok </a>
 
		<script type="text/javascript">
			alert('ok');
			elem =document.getElementById('foo')
			if (elem.addEventListener){
				elem.addEventListener('click', function(){alert('un')})
				elem.addEventListener('click', function(){alert('deux')})
				}
			else (elem.attachEvent){	
				document.getElementById('foo').attachEvent('onclick', function(){alert('trois')})
				document.getElementById('foo').attachEvent('onclick', function(){alert('quatre')})
			}
 
			alert('ok');
		</script>
	</body>
</html>

voila mon code; aucune popup ne se lance.

Code:

1
2
3
4
else (elem.attachEvent){	
	document.getElementById('foo').attachEvent('onclick', function(){alert('trois')})
	document.getElementById('foo').attachEvent('onclick', function(){alert('quatre')})
}

Il ne manquerait pas un ptit mot là dedans ? ;)

12/04/2012, 18h10
skyser

euh ba dite le moi pck la je suis perdu moi ;)
12/04/2012, 18h19
NoSmoking

Citation:

Il ne manquerait pas un ptit mot là dedans ? ;)

et un contenu entre accolade en trop éventuellement.

Code:

1
2
3
4
else (elem.attachEvent){	
	document.getElementById('foo').attachEvent('onclick', function(){alert('trois')})
	document.getElementById('foo').attachEvent('onclick', function(){alert('quatre')})
}

pour moi il ne manque rien la dedans alors soyaient clair SVP

12/04/2012, 19h07
NoSmoking

il te faut revoir les bases sur if...else
:fleche: un petit rappel...

Code:

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
<html>
	<head>
		<title>test</title>
	</head>
 
	<body>
		<div id="foo" > ok </div>
 
		<script type="text/javascript">
			alert('ok');
			elem =document.getElementById('foo')
			if (elem.addEventListener){
				elem.addEventListener('click', function(){alert('un')})
				elem.addEventListener('click', function(){alert('deux')})
				}
			else if(elem.attachEvent){	
				document.getElementById('foo').attachEvent('onclick', function(){alert('trois')})
				document.getElementById('foo').attachEvent('onclick', function(){alert('quatre')})
			}
 
			alert('ok');
		</script>
	</body>
 
</html>

erreur stupide :) c est la fatigue ! bon maintenant seulement la première popup est lancé :(

manque un dernier argument à la méthode addEventListener, false.

voila un code qui fonctionne

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE HTML>
<html>
	<head>
		<title>test</title>
	</head>
	<body>
		<div id="foo" > ok </div>
		<script type="text/javascript">
			alert('ok #1');
			var elem =document.getElementById('foo');
			if( elem.addEventListener){
				elem.addEventListener('click', function(){alert('un')}, false);
				elem.addEventListener('click', function(){alert('deux')}, false);
				}
			else{
				elem.attachEvent('onclick', function(){alert('trois')});
				elem.attachEvent('onclick', function(){alert('quatre')});
			}
			alert('ok #2');
		</script>
	</body>
</html>

12/04/2012, 19h47
skyser

ok merci beaucoup :)

une dernière petite info,

j'ai travaillé sur des Listener en JAVA et je sais que c est truc c est chiant surtout pour les supprimer !
du coup je voulais savoir si il se supprimer tout seul ?
12/04/2012, 20h15
NoSmoking

pour supprimer un "EventListener"

Code:

oElem.removeEventListener( event, fonction, useCapture);

ou

Code:

oElem.detachEvent(event, fonction); // pour IE < 9

il faut que la fonction soit référencée, non anonyme donc.
12/04/2012, 22h03
skyser

enfaite j'ai mal formulé ma question !

Si on a un listener et qu'on change de page ! est ce que le listener existe toujours ?
12/04/2012, 23h20
Watilin

La réponse courte c'est non. Normalement, tout le contexte JavaScript est détruit quand on quitte la page.
La réponse longue, c'est que si tu reviens sur la page avec le bouton « précédent », je ne sais pas ce qui va se passer... Je suppose que ça dépend du navigateur.
13/04/2012, 08h19
SpaceFrog

Citation:

il faut que la fonction soit référencée, non anonyme donc.

sinon par defaut si il n'y a pas de fonction nommée ça vide tout ?