onclick ne marche pas [Résolu]

[Benji2]

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

Code Javascript :

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

[Bovino]

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

[Benji2]

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

Code Javascript :

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?

[Loceka]

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

Code :

butt.onclick = function() {alert('clique effectué');};

[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.

[Benji2]

Merci beaucoup Bovino et Loceka

ç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 javascript :

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);

[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.

[Benji2]

j'ai englobé tout mon script dans:

Code javascript :

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
apparemment Greasemonkey a du mal à supporter onclick alors j'ai utiliser la methode addEventListener.

ça fonctionne yeah !