Objets et evenements en javascript?

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Objets et evenements en javascript?

solcarlus13

Salut à tous,

J'ai voulu approfondir ma connaissance du gestionnaire d'evenement javascript en réalisant un drag'n'drop tout bête.

Tout se passait bien, jusqu'à ce que je me mette en tête de mettre le tout sous la forme d'un objet...

Après avoir essayer de tourner le tout sous plusieurs formes, tester différentes syntaxes pour créer mes objets etc... J'en suis arrivé au constat suivant :
Si je veux définir une capture d'evenement où mafonction est une méthode de monobjet, du type :

Code :

document.onmousemove = monobjet.mafonction;

Je constate que cette méthode est incapable d'accèder aux attribut de l'objet...

Plus concretement :

Code :

var Objet = function(){
this.foo = 'bar';
this.mafonction = function(){
alert(this.foo);
}
}
var monobjet = new Objet();
document.onmousedown = monobjet.mafonction;

En cliquant, on obtient bien une alerte, mais foo est "undefined".

Je ne maitrise pas assez bien la POO, ni même les gestionnaires d'evenements pour comprendre ce qui manque, ou ce qui est incorrect/impossible/incohérent...

Et c'est bien pour ça que je vous demande votre avis...
Alors, c'est grave docteur? Est-ce que je dois tout de suite commencer à manger mon clavier?

Publicité

anapajari

s/travail/glanding on hfr/gs;

J'ai eu a peu près le même problème

En fait quand ta fonction 'mafonction' est appelée, l'objet courrant ( this) n'est pas ton objet (Objet) mais l'objet l'ayant appelé ( dans ton cas document).

Du coup moi j'ai rusé en faisant:

Code :

var Objet = function(){
var self = this;
this.foo = 'bar';
this.mafonction = function(){
alert(self.foo);
}
}

Message édité par anapajari le 08-12-2005 à 14:02:50

solcarlus13

Je vois ce que tu veux dire, et effectivement ça fonctionne comme ça.
Merci.

Mais en définissant un variable self comme ça, celle ci n'est plus un attribut de mon objet.
Du coup, tout mes objets vont devoir partager la même variable self...
Me trompe-je?

N'est-il pas possible de définir le bon objet courant?

anapajari

s/travail/glanding on hfr/gs;

Non, en definissant self comme ça c'est une attribut "privé" de ton objet ( donc non accessible hors de ta classe), mais il est bien spécifique à chaque objet.

solcarlus13

Autant pour moi :pt1cable:
Va falloir que je revois ce chapitre aussi alors... j'croyais qu'une variable definit avec var etait accessible par tout le script (ce qui doit être vrai dans une fonction quelconque, mais pas dans la metohde d'un objet... la boulette)

Merci encore.
A+

solcarlus13

Après correction, mon drag'n'drop basique fonctionne, alors pour vous (te, anapajari) remercier, voici le resultat de mon dur labeur (je serais ravi d'accueillir vos remarques, suggestions, critiques, meme severes, mon but ici etant d'apprendre qlq chose) :

http://dl-1.free.fr/52616e646f6d49 [...] /test.html
(au passage merci à Free... même si c pas la fonctionnalité première, leur nouveau truc de Download/Upload sert bien...)
Remarque : le lien ne sera valable que 24h. Si mon travail d'artiste donne lieu à un flot continue de commentaires, je mettrais ça en ligne plus proprement...

anapajari

s/travail/glanding on hfr/gs;

Bin c'est pas mal

Mais:
1- ton constructeur d'object plutot que de lui passer un div, je lui aurais fait créer le div ( fonction dom:createElement, appendChil) afin de
2- Déclarer tes onmouse directement dans ton objet, ce qui te permettait
3- De pas avoir besoin d'un objet Dragged

J'ai un truc qui marche comme ça, si ça t'interesse je te montrerais!

solcarlus13

Mais si je fais un truc du genre

Code :

monobjet.onmousemove = mafunction()

mafonction sera effectivement appelé qd je bouge ma souris, mais seulement si je la bouge au dessus de cette div, non?

A priori pour un drag'n'drop c'est pas trop genant vu que justement tu deplaces ton objet en lui cliquant dessus etc... Mais en réalité, si tu bouges trop vite, le pointeur à le temps de sortir de la div avant que ta fonction soit re appelée...

Du coup, ne vaut-il pas mieux attraper tout les evenement du "document" (de "window"?)?

Je me soupçonne d'avoir raté un truc mais bon...

Message cité 1 fois

anapajari

s/travail/glanding on hfr/gs;

Si mais rien ne t'empeches d'attraper les evenements du document dans un evenement de ton objet ...

Un truc dans ce genre la:

Code :

/*** click sur ton objet ***/
this.MouseDown = function MouseDown(event) {
var self=this;
/*** appel de la fonction moove de ton objet sur un moove de document ***/
document.onmousemove=function(event){self.mooveDrag(event);}
/*** appel de la fonction qui arrete le moove de ton objet sur mouse up***/
document.onmouseup=function(event){self.stopDrag(event);}
/***
d'autres trucs si tu as besoin
***/
}

omega2

solcarlus13 a écrit :

Mais si je fais un truc du genre

Code :

monobjet.onmousemove = mafunction()

Pour les drag'n'drop, t'as des onmouseup et onmousedown (pas certain du nom des fonctions) et là, tu t'en fiches de savoir si t'es entre de survoler vu que le navigateur fera réagir de lui même l'élément qu'était sous le curseur au moment où tu appuis ou relache le bouton de la souri.

FORUM HardWare.fr

Programmation

HTML/CSS

Objets et evenements en javascript?

Sujets relatifs
pdf et javascript	Contrôle adresse en javascript
récupérer le code source page Web https..(dhtml, javascript) avec vba?	[Javascript] longueur de Calque dynamique
J'ai un problème avec les evenements et les variables javascript ?	Besoin d'aide sur setInterval et javascript orienté objet...
Firefox 1.5 et Javascript 1.6	Aide pour javascript : prévisualisation en direct !
[javascript] écrire à la fin du document
Plus de sujets relatifs à : Objets et evenements en javascript?

Page générée en 0.061 secondes