Wie entfernt man alle Optionen eines Auswahlfeldes und fügt dann eine Option hinzu und wählt sie mit jQuery aus?

Question

Mit Kern jQuery, wie Sie alle Optionen eines Auswahlfeldes zu entfernen, dann fügen Sie eine Option und wählen Sie es?

Meine Auswahlbox ist die folgende.

<Select id="mySelect" size="9"> </Select>

EDIT: Der folgende Code war bei der Verkettung hilfreich. Allerdings (im Internet Explorer) .val('whatever') die hinzugefügte Option nicht ausgewählt hat. (Ich habe in beiden Fällen denselben "Wert" verwendet .append y .val .)

$('#mySelect').find('option').remove().end()
.append('<option value="whatever">text</option>').val('whatever');

EDIT: Versuchen, es zu bekommen, um diesen Code zu imitieren, verwende ich den folgenden Code, wenn die Seite/Formular zurückgesetzt wird. Dieses Auswahlfeld wird durch eine Reihe von Optionsfeldern ausgefüllt. .focus() war näher, aber die Option erschien nicht ausgewählt, wie es bei .selected= "true" . Nichts ist falsch mit meinem bestehenden Code - ich bin nur versuchen, jQuery zu lernen.

var mySelect = document.getElementById('mySelect');
mySelect.options.length = 0;
mySelect.options[0] = new Option ("Foo (only choice)", "Foo");
mySelect.options[0].selected="true";

EDIT: Die ausgewählte Antwort kam dem, was ich brauchte, sehr nahe. Das hat bei mir funktioniert:

$('#mySelect').children().remove().end()
.append('<option selected value="whatever">text</option>') ;

Aber beide Antworten führten mich zu meiner endgültigen Lösung

Answer 1

Wie wäre es, wenn Sie einfach die Html-Datei in neue Daten ändern.

$('#mySelect').html('<option value="whatever">text</option>');

Ein weiteres Beispiel:

$('#mySelect').html('
    <option value="1" selected>text1</option>
    <option value="2">text2</option>
    <option value="3" disabled>text3</option>
');

Answer 2

Sie können dies einfach durch Ersetzen von html

$('#mySelect')
.html('<option value="whatever" selected>text</option>')
.trigger('change');

Answer 3

Verwendet die jquery prop() um die ausgewählte Option zu löschen

$('#mySelect option:selected').prop('selected', false);

Answer 4

Ich sah diesen Code in Select2 - Clearing-Auswahlen

$('#mySelect').val(null).trigger('change');

Dieser Code funktioniert gut mit jQuery auch ohne Select2

Answer 5

Dadurch wird Ihr vorhandener mySelect durch einen neuen mySelect ersetzt.

$('#mySelect').replaceWith('<Select id="mySelect" size="9">
   <option value="whatever" selected="selected" >text</option>
   </Select>');