克隆时的问题 - jquery

Question

我正在使用此plugin

现在我正在尝试克隆选择下拉列表。用于添加克隆div的按钮。 因此，用户有一个初始下拉列表，但他可以添加更多。 div被克隆了。

主要的问题是，当我克隆div时，下拉列表与初始下拉列表相关联，而no与新克隆相关联，即克隆。结果是：新克隆的div的所有下拉列表都有事件打开与第一个相关联的选择。

调用插件的脚本

<script language="javascript" type="text/javascript">
$(document).ready(function() {
        $(".mydds").msDropDown();
})

</script>

要克隆的脚本

<script type="text/javascript">
    $(document).ready(function() {
        $('#adicionar').live('click', function(){
            var num = $('.linguas').length;
            var newNum = new Number(num + 1);

            var newElem = $('#copiar' + num).clone(true).prop('id', 'copiar' + newNum);

            newElem.children(':text').prop('name', "myformdata[languages" + newNum + "]").prop('languages', 'languages' + newNum).val('');
            $('#copiar' + num).after(newElem);
            $('#apagar').prop('disabled', '');

        });

</script>

有什么想法解决这个问题吗？ 基本上我认为与下拉列表相关的事件不会被复制...... 感谢

Answer 1

假设每个克隆元素只有一个下拉列表，您可以使用

$('#adicionar').live('click', function(){
    var num = $('.linguas').length;
    var newNum = new Number(num + 1);

    var newElem = $('#copiar' + num).clone(true, true).attr('id', 'copiar' + newNum);

    var id = newElem.find('select').msDropDown().data('dd').get('id');

    newElem.find('[id]').each(function(){
        $(this).attr('id',this.id.replace(id,'customid_' + newNum,'g') );
    });


    $('#copiar' + num).after(newElem);

    newElem.find('select').msDropDown();
});

问题是该插件为初始select元素提供了一个id，并使用该id创建其他元素，并引用其相关的select。

您需要修改所有这些ID以及参考..（上面的代码就是这样...... ）

演示 http://jsfiddle.net/gaby/CXBZR/3/

Answer 2

在您的脚本中，您正在呼叫.clone(true)。此true参数用于克隆事件和数据。

来自API

  

.clone( [ withDataAndEvents ] )
  withDataAndEvents：一个布尔值指示   是否应该使用事件处理程序   与元素一起复制。作为   jQuery 1.4，元素数据将是   也被复制了。

如果删除它，或将其设置为false，则会阻止事件被克隆到新div上。