Ajouter des évènements dynamiquement dans un pop-up

**_jey_** · 17/06/2009, 10h00

Bonjour à tous !

Je développe un site qui nécessite l'intervention de Pop-up... or, je remplis ces pop-up via Javascript. Je crée des éléments : ça marche, j'attribue id et class à chacun : ça marche, j'attache des événements à chaque élément : là, ça ne marche plus !
Pourtant j'ai testé plusieurs moyens :

Code :

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

1
2
3
element.onmouseover("fonction()")
// ou
element.attachEvent("onmouseover", "fonction()");

Y'a-t-il une marche spéciale à suivre pour ce genre de traitement dans un pop-up ? Un DOCTYPE à ajouter ?

A noter que, pour le moment, je travaille sur Firefox.

Merci d'avance !

**franculo_caoulene** · 17/06/2009, 10h10

Salut,

Les évènements sont des propriétés, pas des méthodes.

De plus, pour FF il faut utiliser addEventListener

Un peu plus de recherches t'auraient apporté réponses à tes questions.

**Bovino** · 17/06/2009, 10h28

De plus, il faut que les fonctions appelées existent dans le contexte de ta pop up

**_jey_** · 17/06/2009, 11h57

Envoyé par franculo_caoulene

De plus, pour FF il faut utiliser addEventListener

J'ai confondu attachEvent, et addEventListener ! Avec ce dernier, je n'ai plus d'erreur... mais ça ne marche toujours pas !

Mon problème : mon pop-up contient un tableau de des boutons correspondants chacun à une thématique, et je souhaite qu'au survol, la description correspondante (qui se trouve dans la case juste au-dessous) s'affiche. Rien de bien compliqué à priori...

Voilà ma fonction qui remplit mon pop-up (à partir de deux tableaux définis précédemment), suivie des fonctions d'affichage des descriptions :

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
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
 
function tableauThematiques()
{
	tableau=ID('tabGlobalThem');
	var j=0;
 
	for(var i=0; i<=tabThem.length-1; i++)
	{
		var lien = document.createElement('a')
			lien.href='#';
			lien.id=formater(tabThem[i]);
			lien.className='choix_thematique';
		var spanlien = document.createElement('span');
			spanlien.innerHTML=tabThem[i];
 
		var spandesc = document.createElement('span');
			spandesc.innerHTML=tabDesc[i];
			spandesc.className='desc_choix_thematique';
			spandesc.id='desc_'+lien.id;
 
		lien.appendChild(spanlien);
 
		j=j+1;
		var lig=tableau.insertRow(j);
 
		var col=lig.insertCell(0);
			col.appendChild(lien);
 
		j=j+1;
		var lig=tableau.insertRow(j);
		col=lig.insertCell(0);
			col.appendChild(spandesc);
 
			lien.addEventListener("mouseover", showDesc, false);
			lien.addEventListener("mouseout", hideDesc, false);
	}
}
 
function showDesc()
{
	ID('desc_'+this.id).style.visibility=='visible';
}
 
function hideDesc()
{
	ID('desc_'+this.id).style.visibility=='hidden';
}

Ce code ne me renvoit aucune erreur dans la console, mais pourtant, le survol ne donne rien

**andry.aime** · 17/06/2009, 12h20

Salut,

function showDesc()
{
ID('desc_'+this.id).style.visibility=='visible';
}

Attention, ici 'this' se réfère à l'objet window.

**_jey_** · 17/06/2009, 16h01

Je me doutais que ce "this" était un peu foireux, mais si je donne des arguments au callback, ça me renvoit une erreur sur le type d'arguments

... que dois-je faire ?

**_jey_** · 01/07/2009, 16h37

Je suis de retour de vacances, et je vois avec tristesse qu'il n'y a pas plus de réponse sur mon problème... personne n'est inspiré ?

**Auteur** · 01/07/2009, 21h36

bonjour,

dans ta page mère (si tes éléments sont créés à partir de là) :

Code :

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

1
2
 
taPopUp.document.getElementById("idElement").onmouseover = function(){fonction()}

avec fonction() définie dans la pop-up

**_jey_** · 02/07/2009, 10h08

Mes éléments sont définis dans un script js appelé par le pop-up par <body onload="initiation()">

**Auteur** · 02/07/2009, 11h02

dans ce cas un

Code :

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

document.getElementById("idElement").onmouseover = function(){fonction()}

doit faire l'affaire

**_jey_** · 02/07/2009, 14h20

Merci pour ta réponse Auteur

... j'ai changé de poste hier, et je ne peux pas tester, mais je vais essayer ça ce soir, et je te dirais quoi demain !

**_jey_** · 06/07/2009, 14h27

Ca ne marche pas...
Voici ce que j'ai écrit

Code :

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

1
2
3
4
 
lien.onmouseover = function(){
document.getElementById('desc_'+this.id).style.visibility=='visible';
}

Sachant que le survol est censé provoquer l'affichage de la description (id = desc_lien_x) du lien ( id = lien_x ).

Pour le moment je pars sur une autre solution pour ne pas avoir à ajouter d'évènement de cette manière, mais, ne serait-ce que pas curiosité, j'aimerais assez savoir comment faire !