如何克隆所选插件的select元素

时间:2013-01-06 12:04:17

标签: jquery select jquery-chosen

我使用jQuery的Chosen插件(在这里找到:http://harvesthq.github.com/chosen/)。它增加了选择HTML元素的额外功能。

我想克隆一个包含select元素的div并增加所有id。 问题是克隆是正常的,但select事件适用于源而不是克隆。

<div id="smallConfig">  
<div id="MainConfig_1">

<select data-placeholder="Choose a country" name="country_1" id="country_1" class="chzn-select">
<option value="" /> 
<option value="Afghanistan">Allemagne</option>
<option value="Afghanistan">Belgique</option> 
</select>

<input style="vertical-align: middle;" type="text" class="large" name="cni" id="f_1" />

<span class="f_help"> </span>
<a  class="add">Add more</a>
</div>
</div>


<script type="text/javascript">

var cur_num = 1;    // Counter used previously.

var addAttendee = function(){
var cloned = $("#MainConfig_" + cur_num).clone(true, true).get(0);
++cur_num;
cloned.id = "MainConfig_" + cur_num;                  // Change the div itself.
$(cloned).find("*").each(function(index, element) {   // And all inner elements.
    if(element.id)
    {
        var matches = element.id.match(/(.+)_\d+/);
        if(matches && matches.length >= 2)            // Captures start at [1].
            element.id = matches[1] + "_" + cur_num;
    }
});
$(cloned).appendTo($("#smallConfig"));
};

$('.add').click(addAttendee); // attach event

</script>

我找到了这个帖子How to add Chosen Plugin to dynamically created / cloned CSS div?,但我无法适应我的代码。

1 个答案:

答案 0 :(得分:1)

我遇到了同样的问题,并解决了这个问题:

$('.agregar_otro').click(function(e) {

    var num=$(this).attr("id").split("_");
    var cur_num = num[1];    // Counter used previously.
    //...
    var cloned = $("#datos_solicitud_" + cur_num).clone(true, true).get(0);
    ++cur_num;
    cloned.id = "datos_solicitud_" + cur_num;                  // Change the div itself.
    $(cloned).find("*").each(function(index, element) {   // And all inner elements.
        if(element.id)
        {
            var matches = element.id.match(/(.+)_\d+/);
            if(matches && matches.length >= 2)            // Captures start at [1].
                element.id = matches[1] + "_" + cur_num;
        }
    });
    $(cloned).appendTo($("#contenedor"));
    //this lines are the ones that solves the problem
    //id_almacen is the id of the element chosen which was cloned
    $("#id_almacen_"+cur_num).removeClass("chzn-done").css("display", "block").next().remove();
    $("#id_almacen_"+cur_num).chosen();
});