用新的克隆元素替换克隆元素

replace a clone element with a new clone element

本文关键字：元素 替换      更新时间：2023-09-26

使用Jquery，我试图添加一个克隆元素并删除以前添加的元素。添加克隆元素有效，但删除以前添加的元素无效（它会删除所有克隆元素）。我正在使用"not（）"函数，但它并没有像我希望的那样进行过滤

我在网上搜索了一下，但没有找到解决方案，所以我们将非常感谢您的帮助！

--HTML--

<div id="clone-container">
   <!--cloned element comes here-->
</div>
<div id="original-container">
    <ul>
        <li>
            <span>Value1</span>
        </li>
        <li>
            <span>Value2</span>
        </li>
        <li>
            <span>Value3</span>
        </li>
    </ul>   
</div>

--Jquery--

$(document).ready(function(){
    $('#original-container > ul > li').click(function(event){
       //for adding clone elements
       var $selected_clone = $(this).children("span").clone();
       $selected_clone.appendTo("#clone-container > ul > li");

       // for removing previously added elements
       $("#clone-container > ul > li > span").not($selected_clone).remove();
    });
});

删除appendTo代码执行并替换下面的

$("#clone-container > ul > li > span").not($selected_clone).remove();

带有

$("#clone-container > ul > li > span").html($selected_clone.html());

希望这会有所帮助！！

看看这个。。http://jsbin.com/uZij/1/

HTML

  <div id="clone-container">
    <ul>
      </ul>
   <!--cloned element comes here-->
</div>
<div id="original-container">
    <ul>
        <li>
            <span>Value1</span>
        </li>
        <li>
            <span>Value2</span>
        </li>
        <li>
            <span>Value3</span>
        </li>
    </ul>   
</div>

jQuery

$(document).ready(function(){
    $('#original-container > ul > li').click(function(event){
       //for adding clone elements
       var $selected_clone = $(this).clone();
       $selected_clone.appendTo("#clone-container > ul");

       // for removing previously added elements
       $("#clone-container > ul > li").not($selected_clone).remove();
    });
});
相关文章：