jquery - 如何克隆所选插件的选择元素

Question

我使用 jQuery 选择插件(此处找到: http://harvesthq.github.com/chosen/ )。它添加了额外的功能来选择 HTML 元素。

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

<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?但我无法适应我的代码。

Answer 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();
});