javascript - 有没有办法在 jquery 中克隆 sumoselect 下拉列表

Question

我正在使用jquery sumoselect用于显示多选下拉列表的库。现在我想通过单击按钮克隆此下拉菜单。有什么办法可以实现这一点吗？

$('#chtml').clone().attr('id', 'newid').appendTo('p'); 

我已经尝试过上面的代码，其中 #chtml 是 td 的 id，其中存在我的多选下拉菜单，我想将其复制到 <p></p>标签。

Answer 1

您的尝试似乎有两个问题..

1. 图书馆创建 <p>标签，因此只需附加到 $("p")实际上是将选择元素插入到现有的 SumoSelect 中实例。
2. 图书馆隐藏了原件 <select>所以无论如何你都会附加一个不可见的选择元素。通过调用 SumoSelect() 解决此问题在克隆上。

PS。确实没有必要给它一个新的 id，只需删除现有的 id 即可。

$("#chtml").SumoSelect();

$("#chtml").clone().removeAttr("id").appendTo("#cloneGoesHere").SumoSelect();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.sumoselect/3.0.2/jquery.sumoselect.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.sumoselect/3.0.2/sumoselect.css" rel="stylesheet" />


<select name="somename" id="chtml" tabindex="-1">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
</select>

<p id=cloneGoesHere></p>