javascript - 单击此 div 中的元素复制 div

Question

.step单击div 时，我正在尝试复制div .delete。.delete复制的 div 应显示在单击div的步骤下方

      <div class="step" >
          <h2> sth </h2>

          <div class="copy"></div>
          <div class="delete"></div>
      </div>

      <div class="step" >
          <h2> sth </h2>

          <div class="copy"></div>
          <div class="delete"></div>
      </div>

      <div class="step" >
          <h2> sth </h2>

          <div class="copy"></div>
          <div class="delete"></div>
      </div>

这是我错误的 jQuery：

  $('.copy').click(function(){
   var newDiv = $(this).parent().innerHTML;
   $(this).parent().after(newDiv);
 });     

Answer 1

它将是 jQuery.html()而不是 DOM innerHTML，因为它parent()返回一个 jQuery 包装器。

但是没有必要乱搞 HTML 源代码；使用clone().

$(this).parent().after($(this).parent().clone());

（此外clone(true)，如果您想跨现有事件处理程序进行复制，即click()在新副本上也复制该副本。）

Answer 2

$('.copy').click(function(){
   $(this).parent().after($(this).parent().html());
});

看看这是否适合你。