Vérifier si l'option est sélectionnée avec jQuery, sinon sélectionner une valeur par défaut

en utilisant jQuery, Comment vérifier s'il y a une option sélectionnée dans un menu de sélection, et si ce n'est pas le cas, attribuer l'une des options sélectionnées.

(le select est généré avec un labyrinthe de fonctions PHP dans une application dont je viens d'hériter, donc c'est une solution rapide pendant que je me concentre sur celles-ci:)

202
demandé sur Hank Gay 2008-09-29 20:47:31

18 réponses

bien que je ne sois pas sûr de ce que vous voulez accomplir, ce morceau de code a fonctionné pour moi.

<select id="mySelect" multiple="multiple">
  <option value="1">First</option>
  <option value="2">Second</option>
  <option value="3">Third</option>
  <option value="4">Fourth</option>
</select>

<script type="text/javascript"> 
$(document).ready(function() {
  if (!$("#mySelect option:selected").length) {
    $("#mySelect option[value='3']").attr('selected', 'selected');
  }
});
</script>
264
répondu Joe Lencioni 2014-08-07 11:40:50

pas besoin d'utiliser jQuery pour ceci:

var foo = document.getElementById('yourSelect');
if (foo)
{
   if (foo.selectedIndex != null)
   {
       foo.selectedIndex = 0;
   } 
}
29
répondu FlySwat 2008-09-29 16:57:01

cette question Est vieille et a beaucoup de points de vue, donc je vais juste jeter quelques trucs là-bas qui aideront certaines personnes, je suis sûr.

pour vérifier si un élément select contient des éléments sélectionnés:

if ($('#mySelect option:selected').length > 0) { alert('has a selected item'); }

ou pour vérifier si un select n'a rien sélectionné:

if ($('#mySelect option:selected').length == 0) { alert('nothing selected'); }

ou si vous êtes dans une boucle et que vous voulez vérifier si l'élément courant est sélectionné:

$('#mySelect option').each(function() {
    if ($(this).is(':selected')) { .. }
});

pour vérifier si un element n'est pas sélectionné dans une boucle:

$('#mySelect option').each(function() {
    if ($(this).not(':selected')) { .. }
});

ce sont quelques façons de le faire. jQuery a de nombreuses façons différentes d'accomplir la même chose, donc vous choisissez généralement celui qui semble être le plus efficace.

12
répondu Gavin 2013-09-13 21:00:42

la réponse de lencioni est ce que je recommande. Vous pouvez changer le sélecteur pour l'option ('#mySelect option:last') pour sélectionner l'option avec une valeur spécifique à l'aide de " #mySelect option[value='yourDefaultValue'] ". plus sur les sélecteurs .

si vous travaillez intensivement avec des listes sélectionnées sur le client, consultez ce plugin: http://www.texotela.co.uk/code/jquery/select / . Jetez un oeil à la source si vous voulez voir plus d'exemples de travailler avec des listes de sélection.

11
répondu Alex Pendleton 2017-05-23 11:54:51

voici ma fonction modifiant l'option sélectionnée. Il travaille pour jQuery 1.3.2

function selectOption(select_id, option_val) {
    $('#'+select_id+' option:selected').removeAttr('selected');
    $('#'+select_id+' option[value='+option_val+']').attr('selected','selected');   
}
9
répondu sata 2009-10-30 12:25:17
<script type="text/javascript"> 
$(document).ready(function() {
  if (!$("#mySelect option:selected").length)
   $("#mySelect").val( 3 );

});
</script>
7
répondu Ram Prasad 2010-11-16 12:06:25

facile! la valeur par défaut devrait être la première option. fait! qui vous mènerait à un JavaScript discret, parce que JavaScript N'est pas nécessaire:)

JavaScript Discret

3
répondu Martin Labuschin 2010-08-06 17:08:36

je suis déjà tombé sur le plugin texotela mentionné, qui m'a permis de résoudre comme ceci:

$(document).ready(function(){
    if ( $("#context").selectedValues() == false) {
    $("#context").selectOptions("71");
    }
});
3
répondu meleyal 2011-05-23 14:05:05

regardez le selectedIndex de l'élément select . C'est un vieux truc de DOM, pas spécifique à JQuery.

2
répondu Hank Gay 2008-09-29 16:51:26

c'était un script rapide que j'ai trouvé qui a fonctionné... .Le résultat est assigné à une étiquette.

$(".Result").html($("option:selected").text());
2
répondu Joel 2011-01-27 17:50:47

vous en faites trop pour la sélection. Il suffit de sélectionner la valeur:

$("#mySelect").val( 3 );
1
répondu giagejoe 2009-12-04 16:03:08
if (!$("#select").find("option:selected").length){
  //
}
1
répondu Avinash Saini 2013-08-21 10:04:54

j'ai trouvé un bon moyen de vérifier si l'option est sélectionnée et de sélectionner une valeur par défaut quand elle ne l'est pas.

    if(!$('#some_select option[selected="selected"]').val()) {
        //here code if it HAS NOT selected value
        //for exaple adding the first value as "placeholder"
        $('#some_select option:first-child').before('<option disabled selected>Wybierz:</option>');
    }

si #some_select n'a pas choisi l'option par défaut alors .val() est undefined

1
répondu Marcin Bąk 2015-03-21 16:20:30
$("option[value*='2']").attr('selected', 'selected');
// 2 for example, add * for every option
0
répondu user420944 2011-01-27 17:50:13
$("#select_box_id").children()[1].selected

C'est une autre façon de vérifier l'option est activée ou non dans jquery. Cela renvoie une valeur Booléenne (True ou False).

[1] est l'indice de la zone sélectionnez l'option

0
répondu Taimoor Changaiz 2012-12-16 09:22:27

modifier l'événement sur la boîte de sélection pour le feu et une fois qu'il fait puis tirez juste l'attribut id de l'option sélectionnée: -

$("#type").change(function(){
  var id = $(this).find("option:selected").attr("id");

  switch (id){
    case "trade_buy_max":
      // do something here
      break;
  }
});
0
répondu Akash Deep Singhal 2014-02-14 19:25:28

je cherchais juste quelque chose de similaire et j'ai trouvé ceci:

$('.mySelect:not(:has(option[selected])) option[value="2"]').attr('selected', true);

trouve tous les menus sélectifs de la classe qui n'ont pas encore d'option sélectionnée, et sélectionne l'option par défaut ("2" dans ce cas).

j'ai essayé d'utiliser :selected au lieu de [selected] , mais ça n'a pas marché car quelque chose est toujours sélectionné, même si rien n'a l'attribut

0
répondu Steven Schoch 2014-04-22 19:59:34

si vous devez cocher explicitement chaque option pour voir si elle possède l'attribut" selected", vous pouvez le faire. Sinon, en utilisant option:selected vous obtiendrez la valeur de la première option par défaut.

var viewport_selected = false;      
$('#viewport option').each(function() {
    if ($(this).attr("selected") == "selected") {
        viewport_selected = true;
    }
});
0
répondu zeman 2016-01-17 09:19:43