Hinzufügen eines neuen Elements zum Auswahlfeld nach dem ersten Optionselement mit JQuery

Question

Ich habe eine Combobox mit den folgenden Optionen

<select id="history">
    <option></option>
    <option>element1</option>
    <option>element2</option>
    <option>element3</option>
    <option>element4</option>
</select>

Ich versuche, eine neue Option nach der ersten Option hinzuzufügen. Was ist der beste und effektivste Weg, um dies zu erreichen, ich habe versucht

<script type="text/javascript">
    $("#history").prepend("<option>sdsadas</option>").after('#history:first-child');
    $("<option>asdsad</option>").insertBefore('#history option:first-child');
//    $('option[value="sadsaddsad"]', this).after('option:first');
</script>

aber nichts davon funktioniert so, wie ich es möchte.

Answer 1

Sie können das so machen:

$("#history option:first").after("<option>sdsadas</option>");

Damit wird die erste <option> Tag und fügt dann eine neue Option dahinter ein.

---

jQuery unterstützt zwei Arten des Einfügens an einer Position. Die obige Version ist target.after(content) und dieser andere Weg ist content.insertAfter(target) :

$("<option>sdsadas</option>").insertAfter("#history option:first");

Anmerkung: Man verwendet .after() und die anderen Verwendungen .insertAfter() .

Answer 2

Verwenden Sie

$("#history option:eq(0)").after("<option>New Option Added</option>");

Source : http://www.myphpetc.com/2009/03/jquery-select-elements-tips-and-tricks.html

Answer 3

Verwenden Sie das Folgende:

$("<option>asdsad</option>").insertBefore($('#history option:first-child'));

Anstelle von:

$("<option>asdsad</option>").insertBefore('#history option:first-child');