Erreur avec une classe

Version imprimable

Bonsoir tout le monde,

J'essaye d'apprendre à faire du js en objet mais là ça coince et je ne comprend vraiment pas pourquoi...
C'est une classe qui récupère les coordonnées de la souris, et la console Firefox renvoie une erreur : "this.getPos is not a function" dans la fonction init();
Le code :

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
var Tracking = {
	xy : [],
	allpos : [],
	event : null,
	init : function(e) {
		this.event = (!e) ? window.event : e;
		this.getPos();
	},
	getPos : function() {
		if (this.event.pageX || this.event.pageY) {
			this.xy = [e.pageX, e.pageY];
		} else if (this.event.clientX || this.event.clientY) {
			this.xy = [
				e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft,
				e.clientY + document.body.scrollTop + document.documentElement.scrollTop
			];
		}
		this.addPos();
		alert(this.xy[0]+'-'+this.xy[1]);
	},
	addPos : function() {
		this.allpos.push(this.xy);
	}
};

J'ai tenté avec un namespace mais c'est pareil :( :

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
var Tracking = function() {
	var xy, allpos, event;
	function getPos() {
		if (this.event.pageX || this.event.pageY) {
			this.xy = [e.pageX, e.pageY];
		} else if (this.event.clientX || this.event.clientY) {
			this.xy = [
				e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft,
				e.clientY + document.body.scrollTop + document.documentElement.scrollTop
			];
		}
		this.addPos();
		alert(this.xy[0]+'-'+this.xy[1]);
	}
	function addPos() {
		this.allpos.push(this.xy);
	}
	return {
		init : function(e) {
			this.xy = [];
			this.allpos = [];
			this.event = (typeof(e) == 'undefined') ? window.event : e;
			this.getPos();
		}
	};
 
}();

Et c'est initialisé comme ça :

Code:

addEvent(window.document, 'mousemove', Tracking.init);

Voyez-vous d'où ça peut venir ?

Merci d'avance pour votre aide !

Salut,

Bienvenue sur les forums de dvp.com.

Ton souci est lié au contexte du this.

Quand tu inscris

Code:

addEvent(window.document, 'mousemove', Tracking.init);

c'est la fonction Tracking.init qui est référencée et non l'objet lui-même. Donc quand ton code se déclenche sur le mousemove, le this référence l'objet document concerné par le mousemove; et comme document.getPos(...) n'existe pas :aie: .

Ecris plutôt:

Code:

addEvent(window.document, 'mousemove', function(e) { Tracking.init(e); });

Note aussi que lecode de ta fonction getPos est erroné: tu mêles event et e alors que ce sont les mêmes et que e n'a jamais été défini. Ce sera ton second plantage en perspective.

Plutôt écrire quelque chose comme:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 getPos : function() { var e= this.event; if (e.pageX || e.pageY) { this.xy = [e.pageX, e.pageY]; } else if (e.clientX || e.clientY) { this.xy = [ e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft, e.clientY + document.body.scrollTop + document.documentElement.scrollTop ]; } this.addPos(); console.log(this.xy[0]+'-'+this.xy[1]); },
Bon dev,

ERE

02/05/2010, 12h40
16gsyncro

Ah ok ! Je comprend mieux le pourquoi de comment.
Merci infiniment ça fonctionne impeccable, enfin... Tu es un chef ! :ccool: