EVENT onclick dans une classe JS? [Résolu]

headmax · 16/09/2011, 13h56

Bonjour je suis actuellement en création de classe JS et j'aimerais intégrer des événement javascript comme onclick dans ma classe pouvez vous m'expliquer comment sa marche svp merci a tous.

SpaceFrog · 16/09/2011, 13h57

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick = fcuntion(){}

ou
addEventListener ?

headmax · 16/09/2011, 14h04

Si j'ai un objet div sur lequel je dois lié un event click

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
document.getElementById("div_a").click = function(){
 
}

j'ai essayé ca ne marche pas

.

headmax · 16/09/2011, 14h08

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
 
function myclasse(param1,param2){<blockquote>this.param1 = param1;</blockquote><blockquote>this.param2 = param2;</blockquote><blockquote>this.maMethode(){
alert("mymethode");
}</blockquote>};

SpaceFrog · 16/09/2011, 14h12

heu

Citation:

ça marche pas

ou tu n'as pas réussi à le faire fonctionner ???

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
function init(){
document.getElementById('div_a').onclick=function(){ alert('ben si ça marche')}
}
</script>
</head>
<body onload="init()">
<div id="div_a">div A
</div>
</body>
</html>

Auteur · 16/09/2011, 14h13

bonjour,

comme ceci headmax

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
document.getElementById("div_a").onclick=function(){alert("plop")}

Par contre :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
function myclasse(param1,param2){<blockquote>this.param1 = param1;</blockquote><blockquote>this.param2 = param2;</blockquote><blockquote>this.maMethode(){
alert("mymethode");
}</blockquote>};

=> c'est du n'importe quoi

headmax · 16/09/2011, 14h15

Un event onclick sans classe, je n'ai pas de soucis.
Ici j'ai une classe dans lequel je dois utiliser l'évenement click.
Sauf qu'il ne gere pas

headmax · 16/09/2011, 14h16

mon message d'erreur

Citation:

divEventClick is not defined

SpaceFrog · 16/09/2011, 14h19

Citation:

Ici j'ai une classe dans lequel je dois utiliser l'évenement click.

tu peux developper ?

Auteur · 16/09/2011, 14h22

tu dois affecter l'événement uniquement si l'objet HTML est chargé dans la page HTML donc deux possibilités :

- tu ajoutes les événements sur les autres objet lors du onload :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<body onload="plop()">
 
	<div id="idDiv">
	bla bla bla
	</div
 
</body>

et la partie JS :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<script type="text/javascript">
function plop()
{
	document.getElementById("idDiv").onclick=function(){alert("plop")}
}
 
</script>

- ou alors tu ajoutes directement les balises scripts à la fin de la page (ce que je n'aime pas trop car le code JS est inclus dans le code HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
<body>
 
	<div id="idDiv">
	bla bla bla
	</div>
 
<script type="text/javascript">
	document.getElementById("idDiv").onclick=function(){alert("plop")}
</script> 
 
</body>

headmax · 16/09/2011, 14h25

Je développe avec un code tout simple et surtout avant tout merci pour ton aide

.

J'ai une classe sous la forme

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
function myclasse(param1,param2){
    this.param1 = param1;
    this.param2 = param2;
    this.oneMethode = function(){
           alert("classe fonctionne");
    }
    //method avec element.onclick = function(){} ici a prévoir mais en vain...
}
 
var obj = new myclasse("test1","test2");
obj.oneMethode();

SpaceFrog · 16/09/2011, 14h30

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

 //method avec element.onclick = function(){} ici a prévoir mais en vain...

?? element ??? quel element
tu le passes en param ?

headmax · 16/09/2011, 14h36

re voici comment j'essaye de passer cette methode mais en vain ....

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
var divEventClick = document.getElementById("div_0");
function myclasse(param1,param2,divEventClick ){
    this.param1 = param1;
    this.param2 = param2;
    this.param3 = divEventClick;
    this.oneMethode = function(){
           alert("classe fonctionne");
    }
 
    this.divEventClick.addEventListener("click", thumbClick,true);
 
    this.thumbClick = function(){
        alert("click thumb")
   }
 
}
 
var obj = new myclasse("test1","test2");
obj.oneMethode();

SpaceFrog · 16/09/2011, 14h39

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var divEventClick = document.getElementById("div_0");

Comme sus-dit ...

si tu essayes d'appeler un element avant qu'il ne soit instancié !!!

headmax · 16/09/2011, 16h43

Donc merci pour tes réponses SpaceFrog, effectivement il suffit de mettre

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
onclick = function(){
    alert("ca marche et merci SpaceFrog");
}

Bon week end tu me sauve la vie

. A++

SpaceFrog · 16/09/2011, 17h04

à Auteur qui a débusqué le loup en premier ...

16/09/2011, 13h56	#1
headmax Membre régulier Inscription : juillet 2004 Messages : 92 Détails du profil Informations forums : Inscription : juillet 2004 Messages : 92 Points : 75 Points : 75	EVENT onclick dans une classe JS? Bonjour je suis actuellement en création de classe JS et j'aimerais intégrer des événement javascript comme onclick dans ma classe pouvez vous m'expliquer comment sa marche svp merci a tous.
	00

16/09/2011, 13h57	#2
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 040 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 040 Points : 45 141 Points : 45 141	Code : Sélectionner tout - Visualiser dans une fenêtre à part onclick = fcuntion(){} ou addEventListener ? __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

16/09/2011, 14h15	#7
headmax Membre régulier Inscription : juillet 2004 Messages : 92 Détails du profil Informations forums : Inscription : juillet 2004 Messages : 92 Points : 75 Points : 75	Un event onclick sans classe, je n'ai pas de soucis. Ici j'ai une classe dans lequel je dois utiliser l'évenement click. Sauf qu'il ne gere pas
	00

16/09/2011, 14h30	#12
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 040 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 040 Points : 45 141 Points : 45 141	Code : Sélectionner tout - Visualiser dans une fenêtre à part //method avec element.onclick = function(){} ici a prévoir mais en vain... ?? element ??? quel element tu le passes en param ? __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

16/09/2011, 14h39	#14
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 040 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 040 Points : 45 141 Points : 45 141	Code : Sélectionner tout - Visualiser dans une fenêtre à part var divEventClick = document.getElementById("div_0"); Comme sus-dit ... si tu essayes d'appeler un element avant qu'il ne soit instancié !!! __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

16/09/2011, 17h04	#16
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 040 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 040 Points : 45 141 Points : 45 141	à Auteur qui a débusqué le loup en premier ... __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email