Füllen Sie zwei Auswahlfelder mit einem Array von Optionen?

Question

Ich habe ein Array, das ich verwenden möchte, um zwei verschiedene Auswahlfelder zu füllen, aber ich sehe ein seltsames Verhalten. Das Füllen der ersten Auswahl funktioniert gut, aber wenn Sie die gleiche Liste zum zweiten Auswahlfeld hinzufügen, wird die erste Auswahl gelöscht und das letzte Element wird im zweiten Auswahlfeld ausgewählt.

var optionList = [] 

optionList.push(new Option("waba", "waba")) 
optionList.push(new Option("shaba", "shaba")) 

$('#first_select').html(optionList); //works fine 
$('#second_select').html(optionList); //clears first select and last item is selected 

JS Fiddle Example

Answer 1

Ich glaube, Sie die Option klonen müssen

var optionList = [] 

optionList.push(new Option("waba", "waba")) 
optionList.push(new Option("shaba", "shaba")) 

$('#first').html(optionList); 
$('#second').html($(optionList).clone()); 

Answer 2

Sie haben klonen sie jQuery.clone wie folgt aus:

$('#first').html(optionList); // append the original options 
$('#second').html($(optionList).clone()); // clone them and append the cloned ones 

Answer 3

den HTML-Inhalt für beide eingestellt in einer Aussage:

$('#first, #second').html(optionList); 

jsfiddle: https://jsfiddle.net/tcuow32f/1/