Discussion :

[pierrot547000]

Bonjour,

J'ai un <select> avec 2 entrées et j'aimerais que :
-un code javascript s'exécute si je choisis l'entrée 1
-un autre code javascript s'exécute si je choisis l'entrée 2

Le tout, sans recharger la page, et sans toucher au HTML.

Voici mon HTML justement :

Code :

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

1
2
3
4
<select id="my-id">
<option value="1" selected="selected">Text 1</option>
<option value="2">Text 2</option>
</select>

J'ai pensé à exécuter ce code JQuery

Code :

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

1
2
3
4
5
6
7
8
9
10
 
(function ($) {
    var typeHeaderField = document.getElementById("my-id");
    var valueTypeHeader = typeHeaderField.options[typeHeaderField.selectedIndex].value;
       if (valueTypeHeader == "1") {
       // comportement numéro 1;
    } else {
       // comportement numéro 2;
    }
}(jQuery));

Seulement, ce n'est pas ce que je veux. En effet, je vais bien rentrer une fois dans la première condition, mais si après ça je séléctionne autre chose, je ne vais jamais passer dans la 2ème condition. Quelqu'un a-t-il une idée de comment faire svp ?

Je reprécise mes 2 limites :
- je ne dois pas recharger la page
- je ne dois pas accès directement au code HTML

Je vous remercie d'avance

[SpaceFrog]

Tu parles de Jquery mais ne semble pas l'utiliser ?

Code :

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

1
2
3
 
var typeHeaderField = document.getElementById("my-id");
    var valueTypeHeader = typeHeaderField.options[typeHeaderField.selectedIndex].value;

=>

Code :

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

    var valueTypeHeader = $("#"my-id").val();

ensuite pour déclencher l'event c'est change à appliquer sur tes selects

https://api.jquery.com/change/