Как проверить, выбран ли вариант?

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

Судя по всему, isChecked не работает. Итак, мой вопрос: как правильно это сделать? Спасибо.


person 0x56794E    schedule 18.04.2012    source источник
comment
00zebra00, спасибо, что нашли ответ среди множества вариантов ниже. Однако не забудьте отметить в комментариях ниже обсуждение «наилучшего» способа доступа к выбранному ресурсу. Общая суть заключается в том, что когда вы можете получить доступ к элементу непосредственно в javascript (используя this.selected), вы должны обойти его, используя jQuery ($(this).prop("selected")), но оба они будут работать на вас.   -  person veeTrain    schedule 19.04.2012
comment
Возможный дубликат jQuery Получить выбранный вариант из раскрывающегося списка   -  person Iman Kermani    schedule 03.03.2018


Ответы (11)


ОБНОВЛЕНИЕ

Более прямой метод jQuery для выбранной опции:

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

Отвечая на вопрос .is(':selected'), вы ищете:

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

Не jQuery (возможно, лучшая практика) способ сделать это:

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

Хотя, если вы просто ищете выбранное значение, попробуйте:

$('#mySelectBox').val()

Если вы ищете текст выбранного значения, выполните следующие действия:

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

Проверить: http://api.jquery.com/selected-selector/

В следующий раз поищите повторяющиеся вопросы SO:

Получить текущий выбранный параметр или Установить выбранный вариант или Как получить выбранную опцию $ (this) в jQuery? или option [selected = true] не работает

person iambriansreed    schedule 18.04.2012
comment
Он использует jQuery без уважительной причины. использовать собственные свойства JS DOM. взгляните на это - person gdoron is supporting Monica; 18.04.2012
comment
Похоже, вы не читали мой ответ. this.selected можно использовать вместо $(this).is(":selected"). Думаю, для этого не нужен jsperf, верно? Я ничего не имею против использования jQuery !, но используйте его тогда, когда он вам нужен, а не когда он не дает ничего, кроме накладных расходов и дополнительного кода. - person gdoron is supporting Monica; 18.04.2012
comment
@gdoron this.selected полностью действителен, но он спросил, как это сделать с помощью jQuery. - person iambriansreed; 18.04.2012
comment
Люди продолжают думать, что jQuery - это не javascript, ну ... это библиотека абстракции над javascript, она определенно не должна заменять javascript! - person gdoron is supporting Monica; 18.04.2012
comment
@gdoron Я полностью с вами согласен. Может быть, тем из нас, кто вырос на jQuery, нужно пройти курс исправительного JavaScript. :) - person iambriansreed; 18.04.2012
comment
Похоже, вы проголосовали против всех конкурирующих ответов, надеюсь, я ошибаюсь. - person gdoron is supporting Monica; 18.04.2012
comment
@gmoron Нет, за мой вопрос проголосовали "против" и "за". Тем не менее, хорошая детективная работа. - person iambriansreed; 18.04.2012

Получить выбранный вариант можно так:

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

Живая демонстрация

Но если вы хотите перебрать все параметры, сделайте это с this.selected вместо this.isChecked, которого не существует:

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

Живая демонстрация

Обновление:

У вас есть множество ответов, предлагающих вам использовать это:

$(this).is(':selected') ну, с this.selected это можно сделать намного быстрее и проще, так почему же вам следует использовать его, а не собственный метод элемента DOM ?!

Прочтите Знайте свои свойства и функции DOM в jQuery информации о тегах

person gdoron is supporting Monica    schedule 18.04.2012
comment
@downvoter, хотите прокомментировать? выйди из тени и сражайся! :) - person gdoron is supporting Monica; 18.04.2012
comment
Может быть, потому что вы не ответили на вопрос, но дали лучший опыт. ;) - person iambriansreed; 18.04.2012
comment
@iambriansreed. Ха ?! Я не ответил на вопрос? какая часть вопроса осталась без ответа? - person gdoron is supporting Monica; 18.04.2012
comment
Интересные обсуждения здесь. :) Не уверен, почему все DV, но я UV'd всех, кто использовал this.selected. Я согласен с вашими комментариями о чрезмерном использовании / злоупотреблении jQuery. Часть знания jQuery - это знать, когда его не использовать. Тем не менее, имейте в виду, что селектор ':selected' является настраиваемым селектором Sizzle, поэтому его использование отключает использование querySelectorAll в поддерживаемых браузерах. Это, конечно, не конец света, так как он предоставляет приятный короткий код, но я лично стараюсь избегать вещей, связанных только с Sizzle. - person ; 19.04.2012
comment
@gdoron Когда вы задали этот вопрос в Meta, меня это заинтересовало. Что касается DV, этот узел может быть вам полезен. - person VisioN; 03.06.2012
comment
@Зрение. Добавьте эту ветку в список. Скрипт обмена стеками ужасен, но я ненавижу мета, я никогда больше не буду предлагать что-то там. (У меня есть алгоритм, чтобы ловить каждые последовательные голоса (вверх + вниз), но черт возьми! Я больше не посещаю этот сайт!) - person gdoron is supporting Monica; 03.06.2012
comment
@gdoron Да, я читал ваш последний комментарий к Meta. Для меня все, что написано в вашем вопросе, имеет смысл, но я согласен с amnotiam, вы должны просто использовать SO в качестве архива решений, возвращая небольшой вклад (не как парни, как кодовый парадокс :)). Есть много людей, которые могут сделать ТАК лучше, пусть они это делают. Сохраненные нервы должны иметь большое значение для вас. Давай, друг;) - person VisioN; 03.06.2012
comment
@BoltClock. Эта ветка полна отрицательных голосов, меня видение указывало на другие загадочные отрицательные голоса, в которых участвовал iambriansreed, и я нашел другую ветку после 10 секунд поиска. Я думаю, что мод должен это проверить. Честно говоря, мне все равно, но такие вещи портят stackoverflow. один из пользователей покинул сайт после того, как он получил голос "против" (увидев свой профиль). [Этот поиск в Google может помочь вам узнать, что происходит: iambriansreed downvote site: stackoverflow.com - person gdoron is supporting Monica; 03.06.2012

Если вы не знакомы или не знакомы с is(), вы можете просто проверить значение prop("selected").

Как видно здесь:

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

Изменить:

Как отметил @gdoron в комментариях, более быстрый и наиболее подходящий способ доступа к выбранному свойству параметра - через селектор DOM. Вот скрипт update, отображающий это действие.

if (this.selected == true) {

похоже, работает так же хорошо! Спасибо gdoron.

person veeTrain    schedule 18.04.2012
comment
Не могли бы вы объяснить мне, почему он должен использовать $(this).prop("selected") вместо this.selected ?! что это дает ??! p.s. Я не голосующий против ... - person gdoron is supporting Monica; 18.04.2012
comment
@gdoron, главное преимущество, о котором я подумал, было знакомство. Я не уверен, что is лучше всего использовать, но мне нравится получать доступ к своим свойствам с помощью prop и attr. В большинстве случаев это может быть просто делом вкуса. Да, есть любопытная волна отрицательных голосов! - person veeTrain; 18.04.2012
comment
Я предлагаю прочитать раздел Знайте свои свойства и функции DOM в jQuery информации о тегах. нет причин использовать более медленный код + больше кода, чтобы делать простые вещи. .is() следует использовать для сложного селектора, такого как _3 _ $ (...). Is (: visiable). - person gdoron is supporting Monica; 18.04.2012
comment
@gdoron; Большое спасибо за указание на это. Я соответствующим образом обновил свой ответ. - person veeTrain; 18.04.2012
comment
Нет проблем. Вы можете проголосовать за мой ответ, если считаете, что он лучше других. (Я не хочу, чтобы был принят ответ с $(this).is(':selected'). Stackoverflow следует использовать для изучения передовых методов, а не для распространенных ошибок ...) - person gdoron is supporting Monica; 18.04.2012
comment
@gdoron; звучит неплохо. Выполнено. Если вы считаете, что мой ответ полезен, вы тоже можете это сделать. - person veeTrain; 18.04.2012
comment
Угадайте, что ... он принял этот ответ ... Мне неудобно оставлять OP комментарий о его выборе, вы можете это сделать? - person gdoron is supporting Monica; 19.04.2012

Вы можете использовать этот способ с помощью 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>

person Amir    schedule 18.08.2018

использовать

 $("#mySelectBox option:selected");

чтобы проверить, является ли это конкретным вариантом myoption:

 if($("#mySelectBox option:selected").text() == myoption){
          //...
 }
person Mouna Cheikhna    schedule 18.04.2012
comment
Не голосовал против вас (здесь есть серийные голоса против!), Но что такое myoption ??? - person gdoron is supporting Monica; 18.04.2012
comment
просто строка, которая должна быть примерным вариантом, который OP хочет проверить, выбран ли он - person Mouna Cheikhna; 18.04.2012
comment
Что касается отрицательного голоса, вы можете прочитать комментарии под моим ответом. - person gdoron is supporting Monica; 03.06.2012

Считайте это своим списком выбора:

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

затем вы проверяете выбранную опцию следующим образом:

function doSomething(param) {

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

}
person Masoud Darvishian    schedule 30.11.2017

Если вам нужно проверить состояние выбранной опции для определенного значения:

$('#selectorId option[value=YOUR_VALUE]:selected')
person dimpiax    schedule 05.10.2018

В моем случае я не знаю, почему selected всегда верно. Итак, единственный способ придумать, что я смог придумать, это:

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

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

Если вы хотите только проверить, выбран ли какой-либо параметр, вам не нужно перебирать все параметры. Просто делать

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

Примечание: если у вас есть опция со значением = 0, которую вы хотите выбрать, вам нужно изменить условие if на $('#mySelectBox').val() != null

person Adam    schedule 23.03.2017

Если вы хотите проверить выбранный вариант с помощью javascript

Самый простой метод - добавить атрибут onchange в этот тег и определить функцию в файле js, см. Пример, если ваш файл html имеет такие параметры

 <select onchange="subjects(this.value)">
               <option>Select subject</option>
               <option value="Computer science">Computer science</option>
               <option value="Information Technolgy">Information Technolgy</option>
               <option value="Electronic Engineering">Electronic Engineering</option>
               <option value="Electrical Engineering">Electrical Engineering</option>
 </select>

А теперь добавляем функцию в js файл

function subjects(str){
    console.log(`selected option is ${str}`);
}

Если вы хотите проверить выбранную опцию в файле php

Просто укажите атрибут имени в своем теге и получите доступ к нему. Глобальные переменные / массивы php-файла ($ _GET или $ _POST) см. Пример, если ваш html-файл выглядит примерно так

<form action="validation.php" method="POST">
             Subject:<br>
            <select name="subject">
               <option>Select subject</option>
               <option value="Computer science">Computer science</option>
               <option value="Information Technolgy">Information Technolgy</option>
               <option value="Electronic Engineering">Electronic Engineering</option>
               <option value="Electrical Engineering">Electrical Engineering</option>
            </select><br>

         </form>

И в вашем php файле validation.php вы можете получить доступ следующим образом

$subject = $_POST['subject'];
echo "selected option is $subject";
person Abhishek Pratap Singh    schedule 02.02.2020

var selectedOption = $("option:selected", #selectIdentifier)

<select id="selectIdentifier">
<option>1</option>
<option>2</option>
<option selected="selected">3</option>
</select>

РЕДАКТИРОВАТЬ: этот ответ действителен и позволяет избежать религиозных войн jQuery или нет. Ключ в этом ответе :selected. Чтобы ответить на фактический вопрос, OP должен создать некоторое различие между параметрами, чтобы иметь возможность запрашивать погоду, выбранный конкретный параметр. например, id, data-, value и т. д. оформление самих опций.

person Ishit Vyas    schedule 07.04.2021