时间戳

首页 > 解决方案 > 用同位素复制另一个div中的项目？

jquery - 用同位素复制另一个div中的项目？

问题描述

当我单击它时，我想在右列 ($rightcontainer) 中复制我的一篇文章。但是，我没有看到任何同位素选项可以让您复制项目而不是简单地移动它。是否可以将我的项目保留在我的左列 ($leftcontainer) 中，同时将其添加到右侧？我感谢你的帮助！

$(window).load(function() {
  var $leftcontainer = $('.articleContainer'),
  $rightcontainer = $('.printContainer'),
  $body = $('body'),
  colW = 100,
  columns = null;

  $leftcontainer.isotope({
    itemSelector: '.article-box',
    percentPosition: true,
    masonry: {
      // use outer width of grid-sizer for columnWidth
      columnWidth: '.article-sizer',
    }
  })
  $rightcontainer.isotope({
    itemSelector: '.article-box',
    masonry: {
      columnWidth: $rightcontainer.find('.printContainer')[0]
    }
  })

  // On click, add article to the right section
  $('.main-section').on( 'click', '.insert-button', function() {
    var $item = $(this);
    $rightcontainer.isotope( 'insert', $item );
    $container.isotope('layout');
  });
});

标签： jqueryinsertmovejquery-isotope

解决方案

我不熟悉同位素，但看起来它利用了 jQuery 的 append() 函数。Jquery 的 append() 获取一个元素并将其从其当前父级中删除并将其添加到您的新父级。

在追加之前尝试克隆您的元素。那应该对您的元素进行深层复制，然后附加该副本。

var $item = $(this).clone();

推荐阅读