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

时间:2018-02-22 14:19:06

标签: javascript jquery sumoselect.js

我正在使用jquery sumoselect库来显示多选下拉列表。 现在我想点击按钮克隆这个下拉列表。 有没有办法实现这个目标?

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

我已尝试过以上代码,其中#chtml是我的多选下拉列表中的td的ID,我想将其复制到<p></p>标记。

1 个答案:

答案 0 :(得分:2)

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

  1. 该库会创建<p>个代码,因此只需附加到$("p")就可以将select元素插入到现有的SumoSelect实例中。
  2. 该库会隐藏原始<select>,因此您无论如何都要附加一个不可见的select元素。通过调用克隆上的SumoSelect()解决此问题。
  3. PS。实际上没有必要给它一个新的id,只需删除现有的id。

    &#13;
    &#13;
    $("#chtml").SumoSelect();
    
    $("#chtml").clone().removeAttr("id").appendTo("#cloneGoesHere").SumoSelect();
    &#13;
    <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>
    &#13;
    &#13;
    &#13;