ajout d'evenement sur instance

Version imprimable

bonjour

dans une fonction je fait l'ajout d'evenement avec addEventListener en prenant soint de referencé l'instance ciblé mais malheureusement le ciblage n'est pas pris en compte et j’aurai voulu savoir ou est mon erreur ?

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
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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Video element</title>
 
<link rel="stylesheet" type="text/css" href="res/player_4.css" />
<script type="text/javascript" src="res/player_4_proto2.js"></script>
 
<script type="text/javascript">
 
function coucou(gd){
 
	this.el=document.getElementById(gd);
 
	this.ajoutevent=function(e){
 
		e.preventDefault();
		this.curent(e);
		var luiii=this
		document.documentElement.addEventListener("mousemove", luiii.curent, false);
		document.documentElement.addEventListener("mouseup", luiii.retireevent, false);
 
	}
 
	this.retireevent=function(){
		alert(this)
		var luiii=this
		document.documentElement.removeEventListener("mousemove", luiii.curent, false);
		document.documentElement.removeEventListener("mouseup", luiii.retireevent, false);
 
	}
 
	this.curent=function(e){
 
		var setX =e.clientX;
		document.getElementById('gen2').value=setX;
		this.el.value=setX;
	}
 
}
 
function init(){
	element1=new coucou('gen');
}
 
onload=init
</script>
</head>
<body>
 
<input type='texte' id='gen'>
<input type='texte' id='gen2'>
<button onmousedown='element1.ajoutevent(event)'>blabla</button>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>

y a t'il vraiment une solution ?

Bonsoir,
il te faut utiliser une variable à laquelle on affecte le this, comme tu l'a fait d'ailleurs, et que l'on utilise à l'intérieure des fonctions de l'objet.

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
function coucou(gd){
  // reference a l'objet a l'interieur des fonctions de l'objet
  var that=this; 
 
  this.el=document.getElementById(gd);
 
  this.ajoutevent=function(e){
    e.preventDefault();
    that.curent(e);
    document.addEventListener( "mousemove", that.curent, false);
    document.addEventListener( "mouseup", that.retireevent, false);
  };
 
  this.retireevent=function(){
    document.removeEventListener( "mousemove", that.curent, false);
    document.removeEventListener( "mouseup", that.retireevent, false);
  };
 
  this.curent=function(e){
    // ici this est le document lorsque l'on move
    var setX=e.clientX;
    document.getElementById('gen2').value=setX;
    that.el.value=setX;
  };
}

06/10/2011, 22h41
Invité

impec sa marche tres tres bien il y avait donc pas grand chose, mais j'avoue avoir du mal a comprendre que this soit le document dans ce que j'avait fait

ps:merci car grace a çà je vais pouvoir evolué vers de nouveaux horizon :ccool: