J'ai besoin d'obtenir des données pour toutes les options sélectionnées dans la balise select et pour cela, j'ai utilisé la fonction onclick () qui donne les données des options cliquées uniquement. Mais si l'utilisateur sélectionne toutes les options avec CTRL * A, aucune donnée ne sera reçue. J'ai essayé d'utiliser select () qui ne fonctionne pas dans ce cas.

//jQuery onclick()
$('select[name=sensors]').on('click', function(){
    $('#demo').text($('select[name=sensors]').val());
});

//jQuery select()
$('select[name=sensors]').select(function(){
    $('#demo2').text($('select[name=sensors]').val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select type='list' name='sensors' multiple>
  <option value= "e11">e11</option>
  <option value= "e12">e12</option>
  <option value= "e13">e13</option>
  <option value= "e14">e14</option>
</select>
<!--jQuery onclick()-->
<div id="demo"></div>
<!--jQuery select()-->
<div id="demo2"></div>
3
RegarBoy 22 juil. 2015 à 16:16

2 réponses

Meilleure réponse

Ne liez pas sur click, mais sur change. De cette façon, même les changements provenant d'autres types d'interaction seront pris en compte:

$('select[name=sensors]').on('change', function(){
    $('#demo').text($('select[name=sensors]').val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select type='list' name='sensors' multiple>
  <option value= "e11">e11</option>
  <option value= "e12">e12</option>
  <option value= "e13">e13</option>
  <option value= "e14">e14</option>
</select>
<div id="demo"></div>

Quant à votre expérimentation avec select, voici ce que dit la documentation:

L'événement select est envoyé à un élément lorsque l'utilisateur effectue une sélection de texte à l'intérieur. Cet événement est limité aux champs et aux cases.

Ce n'est tout simplement pas pertinent ici, car l'utilisateur ne sélectionne pas texte mais des options.

5
Denys Séguret 22 juil. 2015 à 13:21

Fait comme ça

$('select[name=sensors]').change(function(){
    $('#demo2').text($(this).val());
});
2
jrath 22 juil. 2015 à 13:19