Jak sprawdzić, czy wybrana jest opcja?

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

Najwyraźniej isChecked nie działa. Więc moje pytanie brzmi, jak to zrobić? Dzięki.

Author: gdoron, 2012-04-18

9 answers

UPDATE

Bardziej bezpośrednia metoda jQuery do wybranej opcji to:

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

Odpowiedź na pytanie .is(':selected') jest tym, czego szukasz:

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

Non jQuery (prawdopodobnie najlepsza praktyka) sposób, aby to zrobić, to:

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

Chociaż, jeśli szukasz tylko wybranej wartości spróbuj:

$('#mySelectBox').val()

Jeśli szukasz tekstu wybranej wartości, wykonaj:

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

Zobacz: http://api.jquery.com/selected-selector /

Następnym razem poszukaj duplikatu więc pytania:

Get current selected option lub Ustaw wybraną opcję lub Jak uzyskać $(this) zaznaczoną opcję w jQuery? lub opcja [selected = true] nie działa

 205
Author: iambriansreed,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 12:17:59

Możesz uzyskać wybraną opcję w ten sposób:

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

LIVE DEMO

Ale jeśli chcesz iterować wszystkie opcje, zrób to za pomocą this.selected zamiast this.isChecked, które nie istnieją:

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

LIVE DEMO

Update:

Masz mnóstwo odpowiedzi sugerujących, aby użyć tego:

$(this).is(':selected') cóż, można to zrobić dużo szybciej i łatwiej z this.selected, więc dlaczego powinieneś używać jej, a nie natywnej metody elementu DOM?!

Przeczytaj Poznaj swoje właściwości i funkcje DOM W jQuery tag info

 23
Author: gdoron,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 10:31:19

Jeśli nie jesteś zaznajomiony z is(), możesz po prostu sprawdzić wartość prop("selected").

Jak widać tutaj :

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

Edit :

Jak zauważył @gdoron w komentarzach, szybszym i najbardziej odpowiednim sposobem uzyskania dostępu do wybranej właściwości opcji jest selektor DOM. Oto fiddle update wyświetlająca tę akcję.

if (this.selected == true) {
Wygląda na to, że działa równie dobrze! Dzięki gdoron.
 2
Author: veeTrain,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-04-18 17:04:11

Użyj

 $("#mySelectBox option:selected");

Aby sprawdzić, czy jest to konkretna opcja myoption:

 if($("#mySelectBox option:selected").text() == myoption){
          //...
 }
 1
Author: Mouna Cheikhna,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-04-18 16:30:32

Potraktuj to jako listę wyboru:

<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>

Następnie zaznaczamy wybraną opcję TAK:

function doSomething(param) {

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

}
 1
Author: Masoud Darvishian,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-11-30 06:42:08

W moim przypadku nie wiem dlaczego selected jest zawsze prawdziwe. Więc jedyny sposób, w jaki udało mi się wymyślić to:

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

    if ( optionHTMLStr.indexOf( 'selected' ) > 0 ) {
        optionSelected = true;
        return false;
    }
});
 0
Author: Sergey Onishchenko,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-06-04 11:58:10

Jeśli chcesz tylko sprawdzić, czy opcja jest zaznaczona, nie musisz sprawdzać wszystkich opcji. Just do

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

Uwaga: Jeśli masz opcję z wartością = 0, którą chcesz wybrać, musisz zmienić warunek if na $('#mySelectBox').val() != null

 0
Author: Adam,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-03-23 10:01:17

Możesz użyć tego sposobu przez 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>
 0
Author: amir,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-08-18 06:41:57

Jeśli chcesz zaznaczyć opcję wybrany stan dla konkretna wartość :

$('#selectorId option[value=YOUR_VALUE]:selected')
 0
Author: dimpiax,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-10-05 00:10:08