Déclenchement onChange sur un select

Bonsoir,

je cherche à simuler la sélection d'un élément dans un select sur une page extérieure, dont je n'ai pas de contrôle sur le contenu.

J'ai quelque chose comme:

Code:

---

1 2 3 4 5

<select class="maClasse"> <option>Option 0</option> <option>Option 1</option> <option>Option 2</option> </select>

---

J'ajoute un listener sur le select:

Code:

---

1 2 3

$("select.maClasse").change(function() { alert("Ça fonctionne !"); });

---

Et je simule une selection de l'utilisateur:

Code:

---

$("select.maClasse").prop('selectedIndex',1).change();

---

Mon listener est bien exécuté, et le select est rempli avec l'option 1.

Seulement, sur cette page, lorsque l'utilisateur sélectionne un élément à la souris, cela entraîne des modifications sur la page.

Ces modifications n'ont pas lieu lorsque la sélection est simulée en JavaScript. Je n'ai que peu de détails sur le fonctionnement de cette page, auriez-vous une idée de ce qui peut clocher?

Comment pourrais-je simuler exactement la sélection via une souris en JavaScript? Pas de succès avec l'appel à .click() non plus.

Merci d'avance !

naaje

Hop, je me réponds à moi-même, je sais que ça servira à quelqu'un un jour !

jQuery ne génère pas les évènements exactement tels qu'ils sont générés suite à une action utilisateur, du coup il faut créer un évènement directement dans le DOM:

Code:

---

1 2 3 4 5 6

$("select.maClasse").prop('selectedIndex',1); // on positione sur la deuxieme option   var event = document.createEvent('HTMLEvents'); // creation d'un évènement HTML event.initEvent('change', true, false); // evenement change, qui se propage et ne peut être annulé   $("select.maClasse")[0].dispatchEvent(evObj); // déclencher le traitement de l'evenement dans le select

---

@+