jQuery移动div内容而不是克隆

Question

我现在使用的代码只是克隆了“ .comment_post” div，并将表单插入到注释下。

我想做的（如果可能的话）是将“ .comment_post” div“移动”到新位置，而不是克隆它。

关于如何执行此操作的任何建议？

的HTML

<div class="comment-post">
<form id="addCommentForm" method="post" action="">
<div class="avatar"><img src="http://www.gravatar.com/avatar/ee61e6c16/?s=36&r=g&d=mm" /></div>
<textarea name="txt" id="txt" class="txtcomment"></textarea><button class="btnComment" type="button">Send</button>
</form></div>

<div class="comment">
<span class="avatar"><img src="http://www.gravatar.com/avatar/ee61e6c16/?s=36&r=g&d=mm"></span>
<span class="poster">Jake</a></span><span class="time">5 months ago</span>
<div class="text">just a test comment ...</div>
<div class="reply"><a href="#" onclick="reply(174);">Reply</a></div><div id="new-174"></div>
</div>

<div class="comment">
<span class="avatar"><img src="http://www.gravatar.com/avatar/ee61e6c16/?s=36&r=g&d=mm"></span>
<span class="poster">Jake</a></span><span class="time">5 months ago</span>
<div class="text">another comment ...</div>
<div class="reply"><a href="#" onclick="reply(175);">Reply</a></div><div id="new-175"></div>
</div>

JS

reply = function(id){
    if(!$('#new-'+id+' .comment-post').length) {
        $('.comment-post:first').clone().attr('id', id).appendTo($('#new-'+id));
        $('#new-'+id+' .txtcomment').focus();
        $('#new-'+id+' .txtcomment').autosize();
        $('#new-'+id+' .txtcomment').bind('keydown', charcounter);
        $('#new-'+id+' .txtcomment').bind('keyup', charcounter);
    }
    else
    {
        $('#new-'+id+' .comment-post').remove();
    }          
}

Answer 1

只是省略.clone()：

$('.comment-post:first').attr('id', id).appendTo($('#new-'+id));

当您使用.appendTo()或.append()将元素附加到单个目标时，该元素将被移动而不是复制。（由您决定是否也要省略.attr()零件。）

您也可以只提供选择器字符串，.appendTo()而不是创建一个新的jQuery对象并传递它：

$('.comment-post:first').attr('id', id).appendTo('#new-'+id);