Ajout d'un évènement click
Soit
Code:
1
2
3
4
|
<div class="ligne" id="btnsup">
<button class="ob_repos" id="btn_vito">VITO</button><button class="ob_repos" id="btn_8p">8P</button>
</div> |
Ce bout de code Html est créé dynamiquement via
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
container='btnsup';
name_object='btn_vito';
document.getElementById(container).innerHTML+='<button id="'+name_object+'" ></button>';
current=document.getElementById(name_object);
current.onclick= function() { alert(this.id); ob_main(this.id);};
name_object='btn_8p';
document.getElementById(container).innerHTML+='<button id="'+name_object+'" ></button>';
current=document.getElementById(name_object);
current.onclick= function() { alert(this.id);}; |
Problème:
seul le bouton n° deux réagit au clic.
Or le but est de pouvoir créer dans un div particulier ( ici 'btnsup' ), une série de bouton de manière dynamique en fonction des besoins.
Chaque bouton doit pouvoir réagir au clic et appelez la fonction adéquate.
En créant un <div>supplémentaire dans lequel je mets le bouton, alors, cela fonctionne, mais je trouve cela étrange.
Où fais-je la grosse bêtise ou qu'est-ce que je n'ai pas compris ?
Merci d'avance pour toutes les pistes que vous pourriez proposer.
------
NB
j'ai essayé aussi avec addeventlistener
J'ai essayé avec IE et Firefox
Dans tous les cas, le phénomène est le même, seul un bouton est actif.
Cela fais bien 3 jours que je bloque la dessus
-------
le document est deja charge
lorsque je rajoute les boutons, le document est deja chargé, disons que pour faire simple, les boutons sont créés suite a un evenements , par exemple le clic sur un bouton.
mon probleme est que le clic fonctionne sur un seul des boutons, pas les deux.
sauf si je mets les boutons dans un div parent.
le code est un extrait resumé. mais le document est deja entierement chargé lorsqu'il s'execute.
si je cree le bouton avec l'action onclick directement via innerHTML, cela marche,
si j'essaye d'ajouter l'evenement onclick apres en js, cela ne marche que sur le dernier bouton.
je vais faire une page test pour montrer le probleme.
en attendant, toutes info concernant l'ajout d'evenements a un objet est bienvenu;)
Je ne demande qu'à comprendre
Merci à sekaijin pour cette très intéressante information.
Il est donc mieux de créer le bouton directement avec du javascript ?
Sinon,
'tu fais donc ceci
- mise dans la file d'attente du moteur html d'un code HTML
- récupération de l'objet
- passage de la main au moteur HTML pour effectuer le rendu (création de l'objet)'
Un petit exemple en javascript ?
comment je peux faire ce passage au moteur HTML ?
:cry: "Je pense qu'il y a là un truc simple à comprendre., "et bien non, c'est très nébuleux :cry:
http://jsfiddle.net/CVtHY/1/
j'ai modifier le code de yahiko que je remercie au passage pour le lien vers jsfiddle.net .
Le code, évidemment ne fonctionne plus comme il faut.
j'ai un bouton fonctionnel et un qui ne l'est pas
Oui, cette version fonctionne mais ...
Oui, cette version fonctionne mais les boutons doivent pouvoir être créé au fur et à mesure.
Ce qui est étrange, c'est que mon code ne fonctionne pas, alors que ce sont les mêmes appels mais dans un ordre différent.
Il me semble que sekaijin donne une explication intéressante mais je ne vois pas encore comment l'exploiter.
