Heim  >  Artikel  >  Web-Frontend  >  Wie wähle ich mit jQuery eine Option in einem Dropdown nach Textbeschreibung aus?

Wie wähle ich mit jQuery eine Option in einem Dropdown nach Textbeschreibung aus?

DDD
DDDOriginal
2024-11-03 12:53:03991Durchsuche

How to Select an Option in a Dropdown by Text Description with jQuery?

So legen Sie einen ausgewählten Wert in einem Select-Steuerelement mithilfe einer Textbeschreibung mit jQuery fest

Beim Arbeiten mit ausgewählten Steuerelementen in Ihrer Webanwendung kann Folgendes auftreten: Situationen, in denen Sie das ausgewählte Element anhand seiner Textbeschreibung und nicht anhand seines Werts festlegen müssen. Während das Festlegen des Werts mit der val()-Methode von jQuery unkompliziert ist, erfordert die Auswahl anhand der Textbeschreibung einen anderen Ansatz.

In jQuery-Versionen 1.6 und höher können Sie das folgende Codefragment verwenden, um dies zu erreichen:

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

Dieser Code wählt alle Optionen innerhalb des Auswahlsteuerelements aus und filtert sie basierend auf ihrem Text. Die Filterfunktion vergleicht den Text jeder Option mit dem bereitgestellten Text1-Wert. Sobald die passende Option gefunden wurde, wird ihre ausgewählte Eigenschaft auf „true“ gesetzt.

Betrachten Sie beispielsweise das folgende Auswahlsteuerelement:

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

Wenn Sie die Option mit dem Text „ Zwei“ mit jQuery können Sie das obige Code-Snippet zusammen mit dem folgenden Code verwenden:

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

Dies führt dazu, dass die Option „Zwei“ in der Dropdown-Liste ausgewählt wird.

Das obige ist der detaillierte Inhalt vonWie wähle ich mit jQuery eine Option in einem Dropdown nach Textbeschreibung aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn