Sélectionner un élément dans une liste HTML SELECT à l'aide du clavier ne déclenche pas l'événement CLICK

Question

J'ai une liste de sélection HTML qui, lorsqu'un élément est sélectionné, doit afficher des informations différentes en dessous. Les événements de modification onclick ou JQuery sont déclenchés lorsqu'un élément de liste de sélection est sélectionné en cliquant dessus (souris), mais pas lorsque l'utilisateur utilise des touches (clavier).

Avez-vous une idée de l'événement à surveiller afin de déterminer quand l'élément de liste sélectionné a changé?

Voici un exemple de test BASIC:

<select id="mylist" name="mylist"> 
    <option value="">(none)</option> 
    <option value="1">Test 1</option> 
    <option value="2">Test 2</option> 
    <option value="3">Test 3</option> 
</select> 

<span id="myspan"></span> 

<script type="text/javascript"> 
    $("#mylist").change(function() { 
     $("#myspan").html($("#mylist").attr("selectedIndex")); 
    }); 
</script> 

Answer 1

Le code sera exécuté lorsque la boîte select perd le focus
(onglet de presse ou cliquez en dehors de la boîte select)

Answer 2

Le OnChange L'événement est différent du navigateur au navigateur lorsqu'un élément est modifié avec des raccourcis clavier. Par exemple, dans IE, l'événement est déclenché de la même manière avec le clavier et la souris, mais dans Firefox, pour déclencher l'événement avec le clavier, vous devez appuyer sur et entrer lorsque l'élément sélectionné est le bon un. L'événement est également déclenché lorsque le < sélectionne > flou (OnBlur - et seulement si OnChange n'a pas déjà été déclenché) comme Gaby l'a signalé.

Il la façon dont il est fait ...