jquery选择克隆不工作

2023年1月14日 190次阅读

我用
jquery choosen plugin来选择单个和多个选项.所以我做了这样的标记

<div class="content">
      <div class="side-by-side clearfix">
        <div>
          <select data-placeholder="Your Favorite Types of Bear" class="chosen-select-width" tabindex="15">
            <option value=""></option>
            <option selected>American Black Bear</option>
            <option>Asiatic Black Bear</option>
            <option>Brown Bear</option>
            <option>Giant Panda</option>
            <option>Sloth Bear</option>
            <option>Sun Bear</option>
            <option>Polar Bear</option>
            <option>Spectacled Bear</option>
          </select>
        </div>
        <div>
          <select data-placeholder="Your Favorite Types of Bear" multiple class="chosen-select-width" tabindex="16">
            <option value=""></option>
            <option>American Black Bear</option>
            <option>Asiatic Black Bear</option>
            <option>Brown Bear</option>
            <option selected>Giant Panda</option>
            <option>Sloth Bear</option>
            <option>Sun Bear</option>
            <option>Polar Bear</option>
            <option>Spectacled Bear</option>
          </select>
        </div>
      </div>
    </div>
    <button type="button" class="btn btn-success pull-right add-new">Add New</button>

我想克隆这个意味着当我点击添加新按钮然后将追加另一行.所以我为此制作了我的jquery

     jQuery('.add-new').click(function() {
      var parent = jQuery('div.content').last();
      parent.clone(true).insertAfter(parent); 
  });

这个正在做克隆,但第二行(克隆)的选择和下拉列表不起作用.每当我点击选择选项时,它都在处理父项.那么有人可以告诉我如何解决这个问题吗？

当我手动复制整个div时,它没有任何问题.所以任何帮助和建议都会非常明显.谢谢

最佳答案 我重写了你的脚本部分：

var clone = $('div.content').clone(true);
$('div.content select').chosen();

jQuery('.add-new').click(function() {
    var parent = jQuery('div.content').last();
     clone.clone(true).insertAfter(parent); 
     $('div.content:last select').chosen();
});

见demo.所以基本上,我在任何选择的逻辑之前都记得div.content.然后我只使用此副本添加新内容.

我希望这是你想要的.

点赞