Элемент clone <select> JQuery

Я хочу клонировать <select> ввод в HTML с помощью JQuery.
Я не знаю, как это сделать, поэтому подумал, что я попрошу здесь.

Особенно интересуется лучшим способом записать его обратно в документ.

Мой элемент select выглядит так:

<select id="options">
    <option value="1">Opt 1</option>
    <option value="2">Opt 2</option>
    <option value="3">Opt 3</option>
</select>

Спасибо.

Ответ 1

Смотрите: http://api.jquery.com/clone/

$('select#options').clone().attr('id', 'newOptions').appendTo('.blah');

appendTo (...) - это только один способ вставки клонированных элементов. Другие методы можно найти здесь: http://api.jquery.com/category/manipulation/

Ответ 2

Как насчет этого?

<select id="options">
    <option value="1">Opt 1</option>
    <option value="2">Opt 2</option>
    <option value="3">Opt 3</option>
</select>

//target

<select id="options2">
</select>

$('#options').find('option').clone().appendTo('#options2');

Спасибо.

Ответ 3

Только проблема с принятым ответом заключается в том, что если ваш select содержит optgroups, они не будут скопированы. В этом случае самым простым способом, который я нашел, было просто сделать это:

$('#options2').html($('#options').html());

Ответ 4

jQuery имеет встроенный метод clone. Есть много параметров для добавления клонированного элемента. Правильный выбор зависит от вашего приложения.

Ответ 5

вы можете выбрать параметр attr true с выбором select, а затем использовать клон в порядке.

$("#options").off("change").on("change", function() {
    var val = $(this).val();

    $(this).find("option[value=" + val + "]").attr("selected", true);
});