Discussion :

[miine]

Bonjour,

C'est la première fois je poste une discussion sur un forum alors si j'ai oublié quelque chose je m’en excuse d'avance.
Alors j'ai commencer le javascript depuis peu et je suis face à un problème des plus agacent.
Dans une page html, au sein d'une fonction je crée un bouton, je lui affecte une propriété '.onClick' mais rien se passe, l’élément apparait pourtant correctement.
Donc si quelqu'un aurait une idée ce serait disons magnifique.
Merci d'avance.

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
function test(player,div,id,btn) {
  player = new PreziPlayer(div, { 
preziId: id, 
width: 620,
height: 444
});
player.on(PreziPlayer.EVENT_STATUS,  function mota (e) {
if (player.getStatus() == 'contentready'){
	var div = document.getElementById(btn);
	var nouveauInput = document.createElement('input');
	nouveauInput.id = 'nouveauId';
	nouveauInput.type = 'image';
	nouveauInput.class ='media';
	nouveauInput.src = 'img/play.png';
	nouveauInput.onClick=function(){alert('ok');}
	div.appendChild(nouveauInput);
} 
});

[miine]

Eh bien par le plus grand des hasards j'ai trouver une petite alternative qui fonctionne a merveille.

Code :

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

.addEventListener( 'click', function(){}

Je connaissais la fonction mais pas la différence avec un simple .onClick.

[SylvainPV]

c'est onclick et non pas onClick. En JavaScript, la casse est importante. Mais addEventListener est une meilleure méthode car elle te permet d'attacher plusieurs listeners sur un même évènement.

[miine]

Merci pour la précision mais si je peut me permettre, j'avais déjà étudié ce scénario et en effet il y a bien dans mon code des .onClick qui fonctionnent parfaitement

[sekaijin]

coup de bol ton navigateur l'accepte mais si ta page est exécuté sur un navigateur qui sui la norme il ne fonctionnera pas.

en règle générale plutôt que

Code :

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

nouveauInput.type = 'image';

pour ajouter un attribut mieux vaut utiliser

Code :

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

nouveauInput.addAttribute('type','image');

en effet pour quelques navigateurs il existe despropriété de l'objet DOMElements qui correspond à autre chose que l'attibut. comme class

Code :

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

1
2
3
myElement.className = 'MyClass';
//ou
myElement.setAttribute('class', 'MyClass');

Soit tu respecte la norme et tu as des chances que ça marche partout
soit tu ne la respectement est des soit de la POH (Programmation Orienté Hasard) ou encore PPC (Programmation Par Chance)

[Bovino]

Attention à certaines subtilités.

Code :

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

nouveauInput.class ='media';

class est un mot réservé en JavaScript, pour affecter un nom de classe CSS, c'est

Code :

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

nouveauInput.className ='media';

Sinon, contrairement à addEventListener(), onclick correspond à une propriété (regarde la syntaxe), tu affectes donc une valeur à cette propriété, mais elle n'est pas cumulative : si tu redéclares un onclick, ça annule le précédent.

[miine]

Merci beaucoup pour ces précisions,
Je vais donc adapter mon code à ces subtilités de langages.