Question

我想在用户点击按钮时克隆选择的对象。到目前为止，我可以设法复制字段/选择输入框，但添加/克隆的新元素，dossent对choosen（）调用作出反应;

到目前为止，我已添加了我的代码：

HTML代码：

<select data-placeholder="Choose something" class="classname" name="somthinghere[]">
     <option value="123">Somthing</option>
     <option value="124">Somthing again</option>
</select>

触发克隆的按钮：

<button class="add_field_button btn btn-warning" data-fields="0" name="add">Add more selectfields and use the choosen plugin</button>

jQuery脚本，用于处理select元素的cloing，并触发选择的对象。

<script>                        
    $(document).ready(function() {
        $(".add_field_button").click(function(e){ 
            e.preventDefault();

            var add_button = $(this);
            var fieldset   = add_button.closest('.fieldset-clone');
            var fieldset_clone;
            var fieldset_content;

            fieldset_clone = add_button
                            .closest('.fieldset-clone')
                            .find('.fieldset-content')
                            .eq(0)
                            .clone();

            fieldset_content = $('<div>')
                .addClass('remove-button')
                .append(fieldset_clone.children());

            add_button.before(fieldset_content);
            add_remove_btn(fieldset_content);

            $('.ny-matrett').chosen();
        });
    });
</script>

Answer 1

在克隆之前，你需要“摧毁”你所选择的。克隆后，您可以重建您选择的。如果我正确理解了这个问题，这是一种方法：

https://jsfiddle.net/xgqbfth7/

HTML部分：

<div id="home">

  <fieldset>
    <legend>#1
    </legend>
    <div class="fieldset-content">
      <div>
        <select data-placeholder="Choose something" class="classname" name="somthinghere[]">
          <option value="123">Somthing</option>
          <option value="124">Somthing again</option>
        </select>
      </div>

      <button class="add_field_button btn btn-warning" data-fields="0" name="add">Add more selectfields and use the choosen plugin</button>
    </div>
  </fieldset>

</div>

JS部分：

var x = 1;

 $(document).ready(function() {

   jQuery('#home select').chosen();
   jQuery(document).on('click', '.add_field_button', function(e) {
     makeChosen(false);
     x++;
     e.preventDefault();
     var add_button = $(this);
     var fieldset = add_button.closest('fieldset');
     var newFieldset = fieldset.clone(true, false).appendTo('#home');
     newFieldset.find('select').append('<option value="">Test ' + x + '</option>');
     newFieldset.find('legend').html(x);
     makeChosen(true);
   });
 });

 function makeChosen(status) {
   if (status) jQuery('#home select').chosen();
   else {
     jQuery('#home select').chosen('destroy');
   }
 }

如何使用clone（）在同一表单上运行多个jQuery selected（）

1 个答案: