jquery - Jquery insertBefore / insertAfter动画不起作用

Question

我制作了一个简单的脚本，允许用户使用向上和向下按钮对 div 进行排序。

jsFiddle：http: //jsfiddle.net/dZ6rC/5/

不幸的是，我尝试在鼠标单击时为移动设置动画并不会导致标签被移动。

这是我的代码：

$('.up').click(function(){
  var previous = $(this).parent().parent().prev('.item');
  $(this).parent().parent().insertBefore(previous).slideUp();
});
$('.down').click(function(){
  var next = $(this).parent().parent().next('.item');
  $(this).parent().parent().insertAfter(next).slideDown();
});​

有人能弄清楚为什么标签不动吗？

Answer 1

在向下滑动元素之前，您没有隐藏元素，因此看不到效果：

http://jsfiddle.net/dZ6rC/4/

你可以在.hide之前添加.slideDown。我认为您可能想从那里稍微改进一下动画，但请记住这一点。

Answer 2

我不完全确定您要完成什么，但链接 3 个parent()调用可能不是最好的方法。

我猜这可以解决您的问题：

$('.up').click(function(){
  $(this).parents('.item').slideUp();
});
$('.down').click(function(){
 $(this).parents('.item').slideDown();
});​

如果我缺少要求，请更新您的问题。

Answer 3

只需添加一系列隐藏和显示：

jQuery(html_usr).insertBefore( "#log_row" ).hide().show('blind');