jQuery - Setzen des ausgewählten Wertes eines Select-Controls über dessen Textbeschreibung

Question

Ich habe ein Select-Steuerelement, und in einer Javascript-Variable habe ich einen Text-String.

Mithilfe von jQuery möchte ich das ausgewählte Element des Auswahlsteuerelements auf das Element mit der Textbeschreibung festlegen, die ich habe (im Gegensatz zu dem Wert, den ich nicht habe).

Ich weiß, dass es ziemlich trivial ist, den Wert einzustellen, z. B.

$("#my-select").val(myVal);

Aber ich bin ein bisschen ratlos, wie ich das über die Textbeschreibung machen soll. Ich schätze, es muss einen Weg geben, den Wert aus der Textbeschreibung herauszubekommen, aber mein Gehirn ist zu sehr mit Freitagnachmittag beschäftigt, um das herauszufinden.

Answer 1

Wählen Sie nach Beschreibung für jQuery v1.6+

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).prop('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

jQuery-Versionen unter 1.6 und größer als oder gleich 1.4

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).attr('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Beachten Sie, dass dieser Ansatz zwar in Versionen über 1.6, aber unter 1.9 funktioniert, aber seit 1.6 veraltet ist. Es wird nicht funktionieren in jQuery 1.9+.

---

Frühere Versionen

val() sollte beide Fälle behandeln.

$('select').val('1'); // selects "Two"
$('select').val('Two'); // also selects "Two"

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Answer 2

Ich habe das nicht getestet, aber vielleicht funktioniert es bei Ihnen.

$("select#my-select option")
   .each(function() { this.selected = (this.text == myVal); });

Answer 3

Versuchen Sie dies... um die Option mit dem Text myText auszuwählen

$("#my-Select option[text=" + myText +"]").prop("selected", true);

Answer 4

Ich mache es auf diese Weise (jQuery 1.9.1)

$("#my-select").val("Dutch").change();

Hinweis: Vergessen Sie nicht die change(), ich musste deswegen zu lange suchen :)

Answer 5

$("#myselect option:contains('YourTextHere')").val();

gibt den Wert der ersten Option zurück, die Ihre Textbeschreibung enthält. Ich habe das getestet und es funktioniert.