onclick ne marche pas

Version imprimable

Bonjour, je cherche à créer une balise input avec javascript.
J'ai essayé ceci:
Code:

1 2 3 4 5 6 7 8 //Creation de l'input var butt = document.createElement('input'); butt.type = 'button'; butt.value = "clique!"; butt.onclick = "alert('clique effectué');"; //Insertion de L'input dans un div 'box' document.getElementById('box').appendChild(butt);
Voila je vois bien apparaitre le bouton mais dès que je clique dessus rien ne se passe :?

Merci d'avance

26/08/2011, 11h27
Bovino

La propriété onclick attend comme valeur une fonction de rappel, toi tu lui passes une chaine... ça risque pas de marcher :aie:

J'ai essayé avec une fonction mais ça ne marche toujours pas 8O

Code:

1
2
3
4
5
6
7
8
9
10
11
12
function clik() {
    alert('clique effectue!');
}
 
//Creation de l'input
var butt = document.createElement('input');
butt.type = 'button';
butt.value = "clique!";
butt.onclick = "clik();";
 
//Insertion de L'input dans un div 'box'
document.getElementById('box').appendChild(butt);

Peut être avec onload?

26/08/2011, 11h42
Loceka

Ce qu'il voulait dire c'était qu'il fallait l'écrire comme ça :

Code:

butt.onclick = function() {alert('clique effectué');};
26/08/2011, 11h51
Bovino

Ou alors (si la fonction clik est définie)

Code:

butt.onclick = clik;

;)

Encore une fois, il faut différencier les types.
"clik();" est une chaine, donc lorsque tu cliques sur le bouton, ça appelle une chaine et le résultat est que rien ne se passe.
clik(); est le résultat de l'exécution de la fonction, donc dans ce cas, tu affecterais au clic du bouton le résultat de l'exécution de cette fonction.
click est une fonction, dans ce cas (et comme dans le cas proposé par Loceka), c'est bien l'exécution de la fonction que génèrera le clic sur le bouton.

Merci beaucoup Bovino et Loceka :ccool:

ça marche du tonnerre avec un fichier html et un fichier js.
Mais il reste un léger soucis. J'ai tenté de lancer ce script sur greasemonkey et le bouton a complètement disparu lorsque j'ai fait le changement.

userscript:

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
	// ==UserScript==
//@name			test bouton
//@description           bouton clique
//@author		        Robthor
// ==/UserScript==
 
 
function click() {
	alert('clique effectué');
}
 
//creation div et insertion dans body
var div1 = document.createElement('div');
div1.id='box';
document.getElementsByTagName('body')[0].appendChild(div1);
 
//ajout style dans l'element lediv1
div1.style.border = '1px double maroon';
div1.style.position = 'absolute';
div1.style.left = '0px';
div1.style.top = '0px';
div1.style.backgroundColor = 'white';
 
//Creation de l'input
var butt = document.createElement('input');
butt.type = 'button';
butt.value = "clique!";
//butt.onclick = function() {alert('clique effectué');};
butt.onclick = click;
 
//Insertion de L'input dans un div 'box'
document.getElementById('box').appendChild(butt);

26/08/2011, 12h58
Auteur

bonjour,

à quel moment ce script est exécuté ?
Pour qu'il fonctionne normalement, la page doit être chargée intégralement. Je te conseille donc de mettre toute la procédure de création de ton input dans une fonction que tu appelleras lors de l'événement onload.
26/08/2011, 13h53
Benji2
j'ai englobé tout mon script dans:
Code:

1 2 3 window.onload = function() { //mon userScript };
dans la console d'erreur de firefox, il est marqué : "Component is not available" à la ligne du window.onload.

Mais j'ai trouvé la solution :D
apparemment Greasemonkey a du mal à supporter onclick alors j'ai utiliser la methode addEventListener.

ça fonctionne yeah !