jQuery: выбрать все элементы «select» с определенным val () - PullRequest
9 голосов
/ 20 января 2011

Кто-нибудь знает простой способ, используя jQuery, чтобы выбрать все <select> элементы, атрибут val () которых дает определенное значение?

Я пытаюсь сделать некоторую логику проверки и хотел быпросто выделите все эти элементы с помощью одного селектора, а затем примените класс предупреждения к каждому из их родителей.Это я знаю, как сделать, как только я выделю все элементы, но я не увидел селектор, который обрабатывает этот случай.

Я собираюсь выбрать все элементы <select> в селектор,затем перебрать их и проверить каждое из их значений?Я надеялся, что будет более простой способ.

Спасибо.

Ответы [ 5 ]

23 голосов
/ 21 января 2011

Почему не select[value=x] не работает?Ну, во-первых, потому что <select> на самом деле не имеет атрибута value.В поле выбора нет ни одного значения: не может быть никаких выбранных параметров (обычно их не должно быть, но может быть хотя бы в IE), а в <select multiple> может быть любое количество выбранныхoptions.

Даже input[value=x] не работает, хотя <input> имеет с атрибутом value.Ну, это работает, это просто не делает то, что вы думаете.Он извлекает значение атрибута value="..." в HTML, , а не текущее значение, которое вы ввели в форму.Атрибут value="..." фактически соответствует свойству defaultValue, а не value.

Аналогично, option[value=x][selected] не работает, поскольку он проверяет атрибут <option selected> из источника HTML (selected attribute -> defaultSelected свойство) и не текущая выбранная опция (selected свойство не атрибут) - которая могла измениться с момента загрузки страницы.

За исключением IE, который неправильно принимает атрибуты формы value, selected и т. Д.

Кроме (снова): пример Tesserex может работать * и причинапотому что он использует нестандартный jQuery-специфичный селектор :has.Это приводит к сбою собственных методов querySelectorAll современных браузеров, и, следовательно, jQuery возвращается к своему собственному (собственный JavaScript, slow ) движку селектора.Этот механизм выбора имеет ошибку, из-за которой он путает свойства атрибутов, позволяя [value=x] делать то, что вы ожидали, и не терпеть неудачу, как должно!(Обновление: это, вероятно, больше не имеет место в более новых версиях jQuery.)

Сводка: проверка состояния поля формы и селекторы не смешиваются.Помимо этих проблем, вам также нужно беспокоиться об избежании проблем - например, что если значение, которое вы хотите проверить, содержит кавычки или квадратные скобки?

Так что вместо этого, да, вы должны проверить это вручную.Например, используя фильтр:

$('select').filter(function() {
    return $(this).val()==='the target value';
}).parent().addClass('warning');

(В HTML5 есть свойство value , поддерживаемое современными браузерами, которое при прочтении выдает значение первого выбранного<option>. JQuery val() безопасен для использования здесь, поскольку он обеспечивает тот же метод получения первой выбранной опции даже в браузерах, которые не поддерживают это.)

10 голосов
/ 21 января 2011

Существующие ответы не работают для выбранных тегов, но я нашел кое-что, что работает.Запросить выбор, который имеет выбранную опцию.

$("select:has(option[value=blah]:selected)")
1 голос
/ 20 января 2011

Вы можете использовать:

$("select[value=X]");

где X - это значение, по которому вы хотите проверить значение выбора.

1 голос
/ 20 января 2011

Селекторы атрибутов Я считаю, что вы ищете.

Что-то вроде $+('element[attribute="value"]')

См. Также:

0 голосов
/ 26 июля 2018

Вы можете создать событие изменения, которое будет помещать значение в пользовательский атрибут элемента select при каждом изменении значения.Затем вы можете использовать простой селектор, чтобы найти все элементы выбора, которые имеют это значение.Например:

$("select").on("change", function (e) {
    var $select = $(e.currentTarget);
    $select.attr("select-value", $select.val());
});

И тогда вы можете сделать это:

var $matches = $("select[select-value='" + searchVal + "']");

$ совпадений будут иметь все ваши выбранные совпадения.

Это намного проще, чемприходится перебирать элементы.Не забудьте установить значение выбора в начальное значение при отображении страницы, чтобы вам не нужно было запускать событие изменения для каждого выбора, чтобы установить значение выбора.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...