web-dev-qa-db-fra.com

Comment vérifier si une option est sélectionnée?

$('#mySelectBox option').each(function() {
    if ($(this).isChecked())
       alert('this option is selected');
     else
       alert('this is not');
});

Apparemment, la isChecked ne fonctionne pas. SO Ma question est la suivante: quelle est la bonne façon de procéder? Merci.

jqueryselectoption
134
0x56794E

UPDATE

Une méthode jQuery plus directe pour l'option sélectionnée serait:

var selected_option = $('#mySelectBox option:selected');

Répondre à la question .is(':selected') est ce que vous recherchez:

$('#mySelectBox option').each(function() {
    if($(this).is(':selected')) ...

La manière de le faire non jQuery (sans doute la meilleure pratique) serait:

$('#mySelectBox option').each(function() {
    if(this.selected) ...

Cependant, si vous ne recherchez que la valeur sélectionnée, essayez:

$('#mySelectBox').val()

Si vous recherchez le texte de la valeur sélectionnée, faites:

$('#mySelectBox option').filter(':selected').text();

Départ: http://api.jquery.com/selected-selector/

La prochaine fois, cherchez les doublons SO questions:

Obtenir l'option actuellement sélectionnée ou Définir l'option sélectionnée ou Comment obtenir l'option sélectionnée dans jQuery? ou option [sélectionné = true] ne fonctionne pas

234
iambriansreed

Vous pouvez obtenir l'option sélectionnée de cette façon:

$('#mySelectBox option:selected')...

LIVE DEMO

Mais si vous voulez parcourir toutes les options, faites-le avec this.selected au lieu de this.isChecked qui n'existe pas:

$('#mySelectBox option').each(function() {
    if (this.selected)
       alert('this option is selected');
     else
       alert('this is not');
});

LIVE DEMO

Mise à jour:

Vous avez beaucoup de réponses vous suggérant d'utiliser ceci:

$(this).is(':selected') eh bien, cela peut être fait beaucoup plus rapidement et facilement avec this.selected alors pourquoi devriez-vous l'utiliser et non la méthode de l'élément natif DOM?!

Lisez connaissez vos propriétés et fonctions DOM dans la jQueryinformations de balise

26
gdoron

Si vous ne connaissez pas ou ne maîtrisez pas bien is(), vous pouvez simplement vérifier la valeur de prop("selected").

comme vu ici :

$('#mySelectBox option').each(function() {
    if ($(this).prop("selected") == true) {
       // do something
    } else {
       // do something
    }
});​

Éditer :

Comme @gdoron l'a souligné dans les commentaires, le moyen le plus rapide et le plus approprié d'accéder à la propriété sélectionnée d'une option consiste à utiliser le sélecteur DOM. Voici le violon mise à jour affichant cette action.

if (this.selected == true) {

semble fonctionner aussi bien! Merci Gdoron.

3
veeTrain

Considérez ceci comme votre liste de sélection:

<select onchange="var optionVal = $(this).find(':selected').val(); doSomething(optionVal)">

                                <option value="mostSeen">Most Seen</option>
                                <option value="newst">Newest</option>
                                <option value="mostSell">Most Sell</option>
                                <option value="mostCheap">Most Cheap</option>
                                <option value="mostExpensive">Most Expensive</option>

                            </select>

alors vous cochez l'option sélectionnée comme ceci:

function doSomething(param) {

    if ($(param.selected)) {
        alert(param + ' is selected!');
    }

}
2
Masoud Darvishian

utilisation

 $("#mySelectBox option:selected");

pour tester si c'est une option particulière myoption:

 if($("#mySelectBox option:selected").text() == myoption){
          //...
 }
1
Mouna Cheikhna

Vous pouvez utiliser cette méthode par jquery:

$(document).ready(function(){
 $('#panel_master_user_job').change(function () {
 var job =  $('#panel_master_user_job').val();
 alert(job);
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="job" id="panel_master_user_job" class="form-control">
                                    <option value="master">Master</option>
                                    <option value="user">User</option>
                                    <option value="admin">Admin</option>
                                    <option value="custom">Custom</option>
                                </select>
1
amir

Si vous devez vérifier l’état de l’option sélectionnée pour valeur spécifique:

$('#selectorId option[value=YOUR_VALUE]:selected')
0
dimpiax

Si vous souhaitez uniquement vérifier si une option est sélectionnée, vous n'avez pas besoin de parcourir toutes les options. Il suffit de faire

if($('#mySelectBox').val()){
    // do something
} else {
    // do something else
}

Remarque: Si vous souhaitez sélectionner une option avec la valeur = 0, vous devez définir la condition if sur $('#mySelectBox').val() != null.

0
Adam

Dans mon cas, je ne sais pas pourquoi sélectionné est toujours vrai. Donc, la seule façon dont j'ai pu imaginer est:

var optionSelected = false;
$( '#select_element option' ).each( function( i, el ) {
    var optionHTMLStr = el.outerHTML;

    if ( optionHTMLStr.indexOf( 'selected' ) > 0 ) {
        optionSelected = true;
        return false;
    }
});
0
Sergey Onishchenko