Вопрос по jquery – Выбор варианта по текстовому содержимому с помощью jQuery

76

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

Как добавить выбранный атрибут к параметру, так что & quot; TEXT & quot; значение равно определенному параметру из строки запроса?

<code> $(document).ready(function() {
        var cat = $.jqURL.get('category');
        if (cat != null) {
            cat = $.URLDecode(cat);
            var $dd = $('#cbCategory');
            var $options = $('option', $dd);
            $options.each(function() {
                if ($(this).text() == cat)
                    $(this).select(); // This is where my problem is
            });
        };
    });
</code>

Ваш Ответ

3   ответа
171

var cat = $.jqURL.get('category');
var $dd = $('#cbCategory');
var $options = $('option', $dd);
$options.each(function() {
if ($(this).text() == cat)
    $(this).select(); // This is where my problem is
});

С этим:

$('#cbCategory').val(cat);

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

Этот ответ устарел. Начиная с jQuery 1.4,.val будет выбирать параметры только по текстовому содержимому, если они не имеютvalue приписывать. Таким образом, в случае, когда элементы option имеют атрибуты значения и они не соответствуют своему текстовому содержимому, приведенный здесь ответ не будет работать.
Этот метод не вызывает события в элементе $ ('apos; # cbCategory & ap;).
я не могу сделать несколько вариантов выбора с этим подходом?
32

что этот вопрос слишком старый, но все же, я думаю, что этот подход будет чище:

cat = $.URLDecode(cat);
$('#cbCategory option:contains("' + cat + '")').prop('selected', true);

В этом случае вам не нужно будет просматривать все варианты сeach(). Although by that time prop() так не существовало для более старых версий использования jQueryattr().

ОБНОВИТЬ

Вы должны быть уверены, когда используетеcontains потому что вы можете найти несколько вариантов, в случае строки внутриcat соответствует подстроке другой опции, отличной от той, которую вы намереваетесь найти.

Тогда вы должны использовать:

cat = $.URLDecode(cat);
$('#cbCategory option')
    .filter(function(index) { return $(this).text() === cat; })
    .prop('selected', true);
Спасибо, что поделились и держите материал в курсе!
20

<option> элементы не имеютvalue атрибуты, то вы можете просто использовать.val:

$selectElement.val("text_you're_looking_for")

Однако, если ваш<option> элементы имеют атрибуты значения или могут иметь значение в будущем, тогда это не сработает, потому что, когда это возможно.val выберет вариант по егоvalue атрибут вместо его текстового содержимого. Нет встроенного метода jQuery, который будет выбирать параметр по его текстовому содержимому, если параметры имеютvalue атрибуты, поэтому нам нужно добавить их самим с помощью простого плагина:

/*
  Source: https://stackoverflow.com/a/16887276/1709587

  Usage instructions:

  Call

      jQuery('#mySelectElement').selectOptionWithText('target_text');

  to select the <option> element from within #mySelectElement whose text content
  is 'target_text' (or do nothing if no such <option> element exists).
*/
jQuery.fn.selectOptionWithText = function selectOptionWithText(targetText) {
    return this.each(function () {
        var $selectElement, $options, $targetOption;

        $selectElement = jQuery(this);
        $options = $selectElement.find('option');
        $targetOption = $options.filter(
            function () {return jQuery(this).text() == targetText}
        );

        // We use `.prop` if it's available (which it should be for any jQuery
        // versions above and including 1.6), and fall back on `.attr` (which
        // was used for changing DOM properties in pre-1.6) otherwise.
        if ($targetOption.prop) {
            $targetOption.prop('selected', true);
        } 
        else {
            $targetOption.attr('selected', 'true');
        }
    });
}

Просто включите этот плагин где-нибудь после добавления jQuery на страницу, а затем выполните

jQuery('#someSelectElement').selectOptionWithText('Some Target Text');

выбрать варианты.

Плагин метод используетfilter выбрать толькоoption соответствует targetText и выбирает его, используя.attr или же.propв зависимости от версии jQuery (см..prop () против .attr () для объяснения).

Вот JSFiddle, который вы можете использовать, чтобы поиграть со всеми тремя ответами на этот вопрос, что свидетельствует о том, что только этот надежно работает:http://jsfiddle.net/3cLm5/1/

Похожие вопросы