Question

如何将div克隆到另一个div的子节点，我可能需要通过$（this）.find（）访问目标div。我的html结构类似于

<div class="destination-wrapper">
  <div class="destination">
  </div>
</div>

<div class="source">
  <p>Content</p>
</div>

所以我需要将'source'克隆到'destination'当我点击'destination-wrapper'时。页面中有很多“目的地包装器”，所以我可能需要使用$（this）.find（'。destination'）

我使用的jquery是以下

$('.destination-wrapper').click(function(){
  $('.source').clone().appendTo($(this).find('.destination'));
});

Answer 1

此处，$(this)指的是$('.source')。如果您想引用$('.destination-wrapper')，则需要将其存储到如下变量中：

$('.destination-wrapper').click(function(){
  var destination = $(this).find('.destination')
  $('.source').clone().appendTo(destination);
});

Answer 2

如果.source是下一个元素，那么你可以这样做，目标包装器......

$('.destination-wrapper').click(function(){

destination=$(this).find('.destination');
  clone=$(this).next('.source').clone();
  clone.appendTo(destination);

});

演示：

＆＃13;

$('.destination-wrapper').click(function(){

destination=$(this).find('.destination');
  clone=$(this).next('.source').clone();
  clone.appendTo(destination);
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="destination-wrapper">
wrapper
  <div class="destination">
  destination
  </div>
</div>

<div class="source">
  <p>Content</p>
</div>


<div class="destination-wrapper">
wrapper
  <div class="destination">
  destination
  </div>
</div>

<div class="source">
  <p>Content</p>
</div>

＆＃13;

使用$（this）选择器将div的克隆附加到另一个div的子节点

2 个答案: