jQuery – Festlegen des ausgewählten Werts eines Auswahlsteuerelements über seine Textbeschreibung

Lesezeit: 5 Minuten

jQuery Festlegen des ausgewahlten Werts eines Auswahlsteuerelements uber seine
DanSingerman

Ich habe ein Auswahlsteuerelement und in einer Javascript-Variablen habe ich eine Textzeichenfolge.

Mit jQuery möchte ich das ausgewählte Element des Auswahlsteuerelements auf das Element mit der Textbeschreibung setzen, die ich habe (im Gegensatz zum Wert, den ich nicht habe).

Ich weiß, dass es ziemlich trivial ist, es nach Wert zu setzen. z.B

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

Aber ich bin ein bisschen ratlos, es über die Textbeschreibung zu tun. Ich schätze, es muss eine Möglichkeit geben, den Wert aus der Textbeschreibung herauszubekommen, aber mein Gehirn ist zu Freitagnachmittag-ed, um es herauszufinden.

  • @DanAtkinson wollte das Gleiche selbst tun. select hat absolut nichts mit dieser Frage zu tun.

    – der Koschmann

    13. Januar 2014 um 9:18 Uhr

1645915868 726 jQuery Festlegen des ausgewahlten Werts eines Auswahlsteuerelements uber seine
Halbmond frisch

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

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 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+.


Vorherige 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>

  • Das fühlt sich so an, als ob es nicht funktionieren sollte (es scheint zweideutig zu sein), aber es sollte eigentlich gut für mich funktionieren. Danke.

    – DanSingerman

    30. Januar 2009 um 16:28 Uhr

  • Beachten Sie, dass jQuery 1.4 dieses Verhalten jetzt in select by geändert hat value wenn das Attribut angegeben wurde, und nur nach Text auswählen, wenn die value Attribut fehlt. Also in diesem Beispiel $('select').val('Two') wird die zweite Option in 1.3.x auswählen, aber in 1.4.x nichts tun.

    – Halbmondfrisch

    3. März 2010 um 19:34 Uhr

  • Also, was ist der beste Weg, es jetzt in 1.4 zu tun?

    – JR Lawhorne

    3. April 2010 um 6:38 Uhr

  • In neueren Versionen von jQuery setzt .val(‘not-an-option-value’) die Auswahl auf die erste Option zurück.

    – dland

    3. Mai 2011 um 9:29 Uhr

  • Die erste Antwort auf diese Frage scheint die Lösung nach 1.3.x zu sein stackoverflow.com/questions/3644449/…

    – DA.

    20. Dezember 2011 um 0:34 Uhr

Ich habe das nicht getestet, aber das könnte für Sie funktionieren.

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

jQuery Festlegen des ausgewahlten Werts eines Auswahlsteuerelements uber seine
Jay Corbett

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

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

  • Die Antwort von @ spoulson hat bei mir funktioniert … Ich habe versucht, es ohne .each zu tun

    – Jay Corbett

    30. Januar 2009 um 16:55 Uhr

  • In vielen Fällen funktioniert dieser Ansatz leider nicht. Ich musste mich sogar zu Klassik entschließen $("#my-Select option[text=" + myText +"]").get(0).selected = true; Stil von Zeit zu Zeit :(…

    – Shahriyar Imanov

    6. März 2011 um 21:15 Uhr


  • Stellen Sie sicher, dass Sie zuerst das ausgewählte Attribut entfernen, bevor Sie es neu einstellen, sonst scheint es nicht zu funktionieren (funktioniert für mich in 1.9)

    – esse

    6. März 2013 um 6:42 Uhr

  • @MarkW Verwenden Sie für 1.9 .prop anstatt .attr; Die Ursache für die Änderung ist, dass jQuery in 1.9 die alten Hacks deaktiviert hat, die Sie verwenden konnten .attr um einige DOM-Eigenschaften sowie HTML-Attribute zu ändern. (Google javascript dom properties vs attributes wenn Sie den Unterschied nicht kennen.)

    – Mark Amery

    4. August 2013 um 9:27 Uhr


  • Aktualisierte Antwort zur Verwendung .prop('selected', true) anstatt .attr('selected', 'selected') für Kompatibilität mit jQuery 1.9+.

    – Erwaman

    16. Januar 2020 um 4:30 Uhr

1645915868 141 jQuery Festlegen des ausgewahlten Werts eines Auswahlsteuerelements uber seine
ErazerBrecht

Ich mache es auf diese Weise (jQuery 1.9.1)

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

Hinweis: vergesst die Änderung() nicht, deswegen musste ich zu lange suchen 🙂

jQuery Festlegen des ausgewahlten Werts eines Auswahlsteuerelements uber seine
Russ Cam

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

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

  • Danke – ich denke, das könnte die Version sein, die ich verwende, da ich auch eine Logik haben muss, wenn es keinen übereinstimmenden Text gibt, und dies scheint der einfachste Mechanismus zu sein, um dies tun zu können.

    – DanSingerman

    30. Januar 2009 um 17:17 Uhr

  • Denken Sie daran, dass es nur den Wert für die erste Option erhält, die mit dem Text übereinstimmt.

    – Russ Cam

    30. Januar 2009 um 18:32 Uhr

  • Außerdem könnten Sie attr(“ausgewählt”, “ausgewählt”) anstelle von val() mit dem umschlossenen Satz verketten, und dies würde ähnlich wie die Antwort von CarolinaJay65 funktionieren

    – Russ Cam

    30. Januar 2009 um 18:57 Uhr

  • sagte OP Einstellung Wert” nicht bekommen Wert”

    – alexandre-rousseau

    10. Oktober 2017 um 13:01 Uhr


1645915870 265 jQuery Festlegen des ausgewahlten Werts eines Auswahlsteuerelements uber seine
David

Um alle Komplikationen der jQuery-Version zu vermeiden, empfehle ich ehrlich gesagt, eine dieser wirklich einfachen Javascript-Funktionen zu verwenden …

function setSelectByValue(eID,val)
{ //Loop through sequentially//
  var ele=document.getElementById(eID);
  for(var ii=0; ii<ele.length; ii++)
    if(ele.options[ii].value==val) { //Found!
      ele.options[ii].selected=true;
      return true;
    }
  return false;
}

function setSelectByText(eID,text)
{ //Loop through sequentially//
  var ele=document.getElementById(eID);
  for(var ii=0; ii<ele.length; ii++)
    if(ele.options[ii].text==text) { //Found!
      ele.options[ii].selected=true;
      return true;
    }
  return false;
}

  • Danke – ich denke, das könnte die Version sein, die ich verwende, da ich auch eine Logik haben muss, wenn es keinen übereinstimmenden Text gibt, und dies scheint der einfachste Mechanismus zu sein, um dies tun zu können.

    – DanSingerman

    30. Januar 2009 um 17:17 Uhr

  • Denken Sie daran, dass es nur den Wert für die erste Option erhält, die mit dem Text übereinstimmt.

    – Russ Cam

    30. Januar 2009 um 18:32 Uhr

  • Außerdem könnten Sie attr(“ausgewählt”, “ausgewählt”) anstelle von val() mit dem umschlossenen Satz verketten, und dies würde ähnlich wie die Antwort von CarolinaJay65 funktionieren

    – Russ Cam

    30. Januar 2009 um 18:57 Uhr

  • sagte OP Einstellung Wert” nicht bekommen Wert”

    – alexandre-rousseau

    10. Oktober 2017 um 13:01 Uhr


1645915870 173 jQuery Festlegen des ausgewahlten Werts eines Auswahlsteuerelements uber seine
Saghir A. Khatri

Diese Zeile hat funktioniert:

$("#myDropDown option:contains(myText)").attr('selected', true);

  • verwenden musste prop('selected', true) für jQuery 1.12.3

    – Matthew Hegarty

    18. Juni 2020 um 13:45 Uhr

869110cookie-checkjQuery – Festlegen des ausgewählten Werts eines Auswahlsteuerelements über seine Textbeschreibung

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy