如何使用 jquery appendTo another div ....然后再返回

Question

当在 div1 中单击某个项目时，它会附加到 div2 的内部。（这真的很好用！）但是我然后单击 div2 中的项目（希望它将 return 到 div1）但没有任何反应。任何想法都非常欢迎。 dom 没有更新吗？我的选择器正确吗？

<div id="div1">
<div class="items">Audi</div>
<div class="items">Jeep</div>
<div class="items">Mini</div>
</div>

<div id="div2"></div>

$('#div1 .items').click(function(){
    $(this).appendTo("#div2");
});


$('#div2 .items').click(function(){
    $(this).appendTo("#div1");
});

Answer 1

试试这个。

$(document).ready(function(){
  
 $(function(){
   $("#div1").on("click", ".items", function(){
     $("#div2").append($(this));
   });
  });
  
  $(function(){
   $("#div2").on("click", ".items", function(){
     $("#div1").append($(this));
   });
  });
});

div{
  display: block;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

<div id="div1">
  <h2>Div 1</h2>
  <div class="items">Audi</div>
  <div class="items">Jeep</div>
  <div class="items">Mini</div>
</div>

<div id="div2">
  <h2>Div 2</h2>
</div>

如何使用 jquery appendTo another div ....然后再返回

How to use jquery appendTo another div .... and back again

javascript

jquery

append

jquery-selectors