Как выбрать option selected jquery



Работа с элементом select из jQuery

Очень часто приходится сталкиваться с раскрывающимся списком

  1. Получим значение value , выбранной опции:
  2. Получим текст выбранной опции:
  3. Сделать недоступным:
  4. Разблокировать
  5. Удалить выбранный элемент:
  6. Удалить первый элемент:
  7. Удалить последний элемент:
  8. Удалить элемент, у которого value=’Sochi’:
  9. Очистить весь список
  10. Перебрать все элементы списка и вывести в блок с выбранным последний элемент:
  11. Сделать выбранным второй элемент:
  12. Сделать выбранным элемент, содержащий текст ‘Новосибирск’:

В первом и втором вариантах используем селектор по тексту :contains(text) , который чувствителен к регистру. Третий вариант от регистра не зависит.

  • Сделать выбранным элемент, value которого = St. Petersburg:
  • Добавить элемент в начало списка :
  • Добавить элемент в конец списка :
  • Добавить новый элемент после третьего:
  • Добавить несколько элементов option в список из массива:
  • Количество элементов option в списке :
  • Проверяем, выбран ли элемент в списке :
  • Сделать все элементы в списке не выбранными:
  • Если у вас есть еще предложения или вопросы, пишите в комментариях!

    Похожие записи

    15 комментариев

    Спасибо, очень полезная информация, чётко по пунктам!

    В 10 примере пару ошибок, правильно так:
    var result;
    $(‘#town option option:selected’).each(function() <
    result = result + this.text + »;
    >);
    $(‘div#result’).html(result);

    Согласен, что есть ошибки, но правильно будет так:

    var result = «»;
    $(‘#town option’).each(function() <
    result = result + this.text + «
    «;
    >);
    $(‘div#result’).html(result);

    Статью писал, когда только начинал разбираться с jQuery… надо будет перепроверить 🙂

    Спасибо за уточнение, в моём предыдущем сообщении, тег br автоматом вырезало 🙂

    В вашем варианте проблема не столько в br, сколько в обращении к option — $(‘#town option option:selected’)

    Алексей,
    13 вариант, поиск регистроЗависимый, изменяя регистр буквы поиск не работает.

    Совершенно верно, ведь селектор по тексту :contains чувствителен к регистру. Если необходимо выполнить поиск не зависимо от регистра, можно перебрать все пункты в цикле, переводя значения к нижнему регистру и сравнивая с искомым текстом. Добавил этот вариант в 13-ый пункт 🙂

    если пользователь уже установил нужные ему option в $(«#town»), то если нужно их изменить при каких-то определенных условиях (например, поезда туда не ходят), метод $(«#town :last»).attr(«selected», «selected»); не работает. Элемент option все ровно остается таким, какой выбрал пользователь.

    я разобрался, лучше писать $(«#town :last»).prop(«selected», «selected»);
    тогда все работает

    Руслан, действительно начиная с jQuery 1.6, метод .attr() возвращает undefined для тех атрибутов, значение которых не было задано, т.е. для получения и выставления таких опций как checked, selected, или disabled нужно использовать метод .prop() Подробнее можно почитать в статье работа со свойствами. Спасибо вам за замечание, обновлю статью.

    JQuery 3.4.1. Для разблокировки селекта строка

    не катит. Нужно писать следующее:

    $(«#town»).prop(«disabled», true);
    $(«#town»).prop(«disabled», false);

    для блокировки и разблокировки соответственно.

    Добрый день, спасибо за статью, только можете обьяснить один момент, зачем в этом примере — $()?
    $(«#town»).prepend( $(‘Рязань’) )
    Почему нельзя просто?
    $(«#town»).prepend(‘Рязань’)
    Вроде и так и так работает, не могу понять что означает $() внутри prepend?

    Добрый день. Конечно могу 🙂 Это банальная опечатка — копипастил код из примеров выше и не удалил $() вот и всё. Спасибо за внимательность — поправил 😉

    Спасибо, просто думал мало ли какой то смысл есть, еще только постигаю jquery, вот и решил уточнить… Особенно после того как недавно столкнулся с разницей в $(this), this и $(this)[0].

    Источник статьи: http://codernote.ru/jquery/rabota-s-elementom-select-iz-jquery/

    Как выбрать конкретный параметр в элементе SELECT в jQuery?

    Если вы знаете индекс, значение или текст. также, если у вас нет ID для прямой ссылки.

    этой, этой и этой все полезные ответы.

    19 ответов

    селектор, чтобы получить средний вариант-элемент, значение

    редактировать: как отмечалось выше, OP, возможно, был после изменения выбранного элемента раскрывающегося списка. В версии 1.6 и выше рекомендуется метод prop ():

    EDIT2: после комментария Райана. Матч на «Выбор 10» может быть нежелательным. Я не нашел селектор чтобы соответствовать полному тексту, но фильтр работает:

    EDIT3: будьте осторожны с $(e).text() поскольку он может содержать новую строку, что делает сравнение неудачным. Это происходит, когда параметры неявно закрыты (no tag):

    используя jquery-2.1.4, Я нашел следующий ответ, чтобы работать на меня:

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

    другие примеры не работали для меня, поэтому я добавляю этот ответ.

    Я использую это, когда я знаю, что индекс списка.

    это позволяет изменить список и запустить событие change. «: Nth(n) » отсчитывается от индекса 0

    для установки выберите значение с выбранным запуском:

    для настройки опции из области:

    этот код использует селектор, чтобы узнать объект select с условием, а затем изменить выбранный атрибут на attr() .

    Futher, я рекомендую добавить change() событие после установки атрибута selected , сделав это, код будет близок к изменению выбора пользователем.

    для выбранного Jquery, если вы отправляете атрибут в функцию и вам нужно обновить-выберите опцию

    Источник статьи: http://askdev.ru/q/kak-vybrat-konkretnyy-parametr-v-elemente-select-v-jquery-1457/

    jQuery работа с Select

    При разработке интернет магазинов очень важно сделать их не просто красивыми, но и удобными. Это будет большим плюсом для покупателей и поисковых систем. Интернет-магазин должен максимально быстро помогать пользователю сделать выбор. Например, в подборе товаров интернет магазина одежды, при выборе покупателем 52 размера, все остальные параметры (тип, цвет, состав и др.) должны автоматически меняться на те значения, которые относятся к 52 размеру.

    Рассмотрим примеры управление выподающими списками:

    1. Снять выбранный элемент

    2. Получить значение выбранного элемента

    Получить значение value выбранного элемента option

    Получить значение текста выбранного элемента

    3. Выбор элемента

    Выбрать элемент со значением value равным 4

    Выбрать последний элемент

    Выбрать элемент содержащий слово «Разработка сайтов»

    4. Удаление элемента option

    Удалить элемент option со значением value равным 3

    Удалить последний элемент

    Удалить все элементы содержащие слово «интернет»

    5. Блокировка элементов

    Заблокировать элемент со значением value равным 4

    Заблокировать второй элемент

    Заблокировать первый элемент

    Заблокировать последний элемент

    Заблокировать все элементы содержащие слово «интернет»

    6. Разблокировка элементов

    Разблокировать элемент со значением value равным 4

    Разблокировать второй элемент

    Разблокировать первый элемент

    Разблокировать последний элемент

    Разблокировать все элементы содержащие слово «интернет»

    7. Добавление элементов

    Добавить в самое начала Select

    Добавить в самый конец Select

    Добавить после второго элемента

    Добавить после элемента со значением 4

    Добавить до элемента со значением 4

    8. Изменение элемента option

    Поменяем текст тега option у выбранного элемента

    Поменяем значение атрибута value у выбранного элемента

    Тут как и в других примерах вы можете использовать селекторы для поиска тега option, например:

    И как обычно небольшой пример:

    Пример работы примера:

    Снять выбранный элемент Выбираем 4-ый элемент! Удаляем первый элемент

    Заблокировать второй элемент Разблокировать второй элемент Добавить в самое начала Select Изменить текст

    Комментарии (Написать комментарий)

    Комментарий:
    Рассмотрим примеры управление выпОдающими списками: :)

    Источник статьи: http://blog.ox2.ru/js/jquery-select/

    Как добавить атрибут» selected » в option с помощью Javascript или jQuery?

    Ниже приведен код для выбора опции и генерации с помощью php из базы данных, и я пытаюсь добавить selected=»selected» to value=»4″ использование jQuery или любого javascript:

    Я пытаюсь сослаться на это в должности но все равно не могу .. ниже приведен мой текущий скрипт:

    6 ответов

    localStorage.getItem(«Select1») вернет Малайзию и $(e).val() вернется 1,2. 5 в каждом цикле. Так что твое состояние никогда не будет истинным. Вместо этого используйте

    Это должно работать просто, $(«#countryselect»).val(‘4’)​

    Он будет автоматически установлен selected=selected

    The это логический атрибут, его наличие устанавливает значение связанного свойства DOM в true . Если атрибут отсутствует, значение выбранного свойства равно false .

    если опция имеет выбранный атрибут, затем при первой загрузке страницы или сбросе формы, в которой находится элемент управления, этот параметр будет выбран.

    если выбрана опция свойства установлено true , затем эта опция будет выбрана. Однако, если форма сброшена, будет выбрана опция по умолчанию (т. е. с выбранным атрибут, или первый вариант, или нет).

    чтобы установить выбранный атрибут (т. е. сделать параметр выбранным по умолчанию):

    обратите внимание, что это может не сделать параметр выбранным в данный момент, он просто добавит выбранный атрибут. Чтобы убедиться, что он выбран (если что обязательно), также установите для выбранного свойства значение true (см. ниже).

    обратите внимание, что второй аргумент setAttribute предполагается строка, которая используется для установки значения атрибута. Однако выбранный атрибут не имеет «устанавливаемого» значения, поэтому второй аргумент игнорируется (например, even false все равно установит атрибут и сделает опцию выбранной по умолчанию). Это вызывает некоторую путаницу. :-)

    установить свойство selected (т. е. просто сделайте опцию текущей выбранной опцией):

    начиная с jQuery 1.6 » для получения и изменения свойств DOM, таких как проверенное, выбранное или отключенное состояние элементов формы, используйте .опора() метод.»

    Источник статьи: http://askdev.ru/q/kak-dobavit-atribut-selected-v-option-s-pomoschyu-javascript-ili-jquery-482402/


    Adblock
    detector