Auswahl der Option nach Textinhalt mit jQuery

Ich möchte ein Dropdown-Feld auf das setzen, was mit jquery durch einen Querystring geleitet wurde.

Wie füge ich das ausgewählte Attribut einer Option hinzu, sodass der Wert "TEXT" einem bestimmten Parameter aus der Abfragezeichenfolge entspricht?

 $(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
            });
        };
    });

Ersetzen Sie dies:

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
});

Mit diesem:

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

Der Aufruf val()auf einer Auswahlliste die Option mit diesem Wert automatisch auswählen, falls vorhanden.

Ich weiß, dass diese Frage zu alt ist, aber ich denke trotzdem, dass dieser Ansatz sauberer wäre:

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

In diesem Fall müssen Sie nicht die gesamten Optionen mit durchgehen each(). Obwohl es zu diesem Zeitpunkt prop()für ältere Versionen von jQuery noch keine gab attr().

AKTUALISIEREN

Sie müssen bei der Verwendung sicher sein, containsda Sie mehrere Optionen finden können, falls die darin enthaltene Zeichenfolge catmit einer Teilzeichenfolge einer anderen Option übereinstimmt als der, mit der Sie übereinstimmen möchten.

Dann sollten Sie verwenden:

cat = $.URLDecode(cat);
$('#cbCategory option')
    .filter(function(index) { return $(this).text() === cat; })
    .prop('selected', true);

Wenn Ihre <option>Elemente keine valueAttribute haben, können Sie einfach Folgendes verwenden .val:

$selectElement.val("text_you're_looking_for")

Wenn Ihre <option>Elemente jedoch Wertattribute haben oder dies möglicherweise in Zukunft tun, funktioniert dies nicht, da .valeine Option nach Möglichkeit anhand ihres valueAttributs anstelle ihres Textinhalts ausgewählt wird. Es gibt keine integrierte jQuery-Methode, die eine Option anhand ihres Textinhalts auswählt, wenn die Optionen valueAttribute haben. Daher müssen wir eine Option selbst mit einem einfachen Plugin hinzufügen:

/*
  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');
        }
    });
}

Fügen Sie dieses Plugin einfach irgendwo hinzu, nachdem Sie jQuery zur Seite hinzugefügt haben, und tun Sie es dann

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

Optionen auswählen.

Die Plugin-Methode wählt filternur den optionpassenden Zieltext aus und wählt ihn je nach jQuery-Version entweder .attroder aus ( Erläuterungen .propsiehe .prop () vs .attr () ).

Hier ist eine JSFiddle, mit der Sie mit allen drei Antworten auf diese Frage spielen können. Dies zeigt, dass diese die einzige ist, die zuverlässig funktioniert: http://jsfiddle.net/3cLm5/1/