Question

我必须从我的网站上删除（）一些iems然后将它们追加回去，但是当我确实追加它们时它们出现在不同的地方，而我希望它们准确地显示在他们以前的同一个地方是

有没有解决这个问题？

这是一个沙箱，随时更新（注意第一次附加后图像如何改变位置）：

http://jsfiddle.net/Zt9tZ/1/

Answer 1

也许我在这里缺少一些额外的信息，但为什么要完全删除它？您有什么理由不能使用hide和show吗？

http://jsfiddle.net/Zt9tZ/10/

附加问题是您将元素作为最后一个元素添加到父元素中。如果由于某种原因你真的必须完全删除元素，你可以在它的位置放置某种占位符。也许使用replaceWith和一些不可见的元素，稍后将再次使用原始元素替换它。

或者，您可以跟踪最近的兄弟姐妹并使用insertBefore或insertAfter。

编辑：insertAfter的一个例子：

var image = jQuery(".image"); 
var prev;

jQuery("#remove").click(function(){
    prev = image.prev();
    image.remove();
});

jQuery("#append").click(function(){
    if(prev.length === 0){
        // element was first
        jQuery("#container").prepend(image);
    }else{
        image.insertAfter(prev);   
    }
})

http://jsfiddle.net/Zt9tZ/12/

EDIT2：replaceWith：

的示例

var image = jQuery(".image"); 
var replacement = $("<div></div>");

jQuery("#remove").click(function(){
    image.replaceWith(replacement);
});

jQuery("#append").click(function(){
    replacement.replaceWith(image);
})

http://jsfiddle.net/Zt9tZ/13/

Answer 2

在这种特殊情况下，您应该使用.prepend()代替，将其放回所选元素的开头，而不是结尾。

Answer 3

我会为图像做一个绝对位置CSS。

<强> CSS

.imageStatic
{
    position:absolute;
    left:20px;
    top:45px;
}

Javascript

var image = jQuery(".imageStatic"); 

jQuery("#remove").click(function(){
    var image = jQuery(".imageStatic").remove();
});

jQuery("#append").click(function(){
    jQuery("#container").append(image);
    $("#container img").addClass("imageStatic");
})

工作样本：http://jsfiddle.net/Zt9tZ/9/

Answer 4

您可以使用hide（）和show（）来达到相同的效果，但元素将保持原位。

基本上，像这样：http://jsfiddle.net/4JQ9m/

jQuery的追加（）定位

4 个答案: