evenement onclick

Version imprimable

evenement onclick

bonjour à tous, nouveau sur le forum, j'ai un petit problème.

j'essai de creer un nouveau span avec appendChild() dans lequel se trouve un boutton qui fait appelle à une fonction.

le problème est que cette fonction est exécutée dès la cration du span.

voici mon 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
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
<html>
	<head>
<title>test create</title>
<script type="text/javascript"></script>
	<script>
 
	var container;
	var nouveauSpan;
	var nouvelInput;
	var nouveauBouton;
	var nouveauBr;
 
	function creer(span){
 
		if (span == 'a'){
		container = document.getElementById("container");
		nouveauSpan = document.createElement("span");
		nouvelInput = document.createElement("input");
		nouveauBr = document.createElement("br");
		nouvelInput.value = 'bla';
		nouveauBouton = document.createElement("input");
		nouveauBouton.type = 'submit';
		nouveauBouton.value = 'effacer';
		nouveauBouton.setAttribute("onclick", effacer());
		nouveauSpan.appendChild(nouvelInput);
		nouveauSpan.appendChild(nouveauBouton);
		nouveauSpan.appendChild(nouveauBr);
		}
		else{
		container = document.getElementById("container");
		nouveauSpan = document.createElement("span");
		nouveauSpan.innerHTML  = ' gol';
		}
 
	container.appendChild(nouveauSpan);
 
	}									
 
	function detruire(){
		container = document.getElementById("container");
		//if (container.childNodes.length>0){
		container.removeChild(container.firstChild);
		//}
	}
	function effacer(){
	alert ('bla')
	}
 
	</script>
</head>
<body onload="detruire()">
<a href="#" id="bla" onclick="creer('a')">creer un span bla</a>
<a href="#" onclick="creer('b')">creer un span gol</a>
<div id="container">
</div>
<a href="#" onclick="detruire()"> detruire un span </a>
</body>
</html>

merci de votre aide...

@+

wraSpay

23/05/2007, 13h19
SpaceFrog

Code:

nouveauBouton.onclick=function(){effacer()};

dans l'absolu il suffirait de :

Code:

nouveauBouton.setAttribute("onclick", "effacer()");

mais bon setAttribute pour le onclick ça sux :vomi:
23/05/2007, 13h27
wraspay

cool

super, ça marche bien...

merci beaucoup, m'avais pris la tête un moment.

@+

wraspay
23/05/2007, 13h38
cerede2000

Citation:

Envoyé par SpaceFrog

mais bon setAttribute pour le onclick ça sux :vomi:

Pourquoi?
23/05/2007, 13h47
SpaceFrog

parcque ce n'est pas cross browser
23/05/2007, 13h51
cerede2000

Ah bon :S .setAttribute n'est pas supporté par quel navigateur?

teste ceci sous IE et FFx ... tu verras bien ;)

Code:

1
2
3
4
5
6
7
8
9
10
<script type='text/javascript'>
function populate(){
document.getElementById('hello').setAttribute("onclick","alert('coucou')")
}
</script>
</head>
 
<body onload="populate()">
<div id='hello'>dd<div>
</body>

puis teste :

Code:

1
2
3
4
5
6
7
8
9
10
<script type='text/javascript'>
function populate(){
document.getElementById('hello').onclick=function(){alert('coucou')}
}
</script>
</head>
 
<body onload="populate()">
<div id='hello'>dd<div>
</body>

23/05/2007, 14h03
cerede2000

A foutu IE pourtant MSDN...
http://msdn2.microsoft.com/en-us/library/ms536739.aspx
23/05/2007, 14h07
SpaceFrog

Variant that specifies the string, number, or Boolean to assign to the attribute....

Tant que tu n'essaye pas d'attribuer une fonction ... mais bon mettre un string dans un onclick :roll: