jquery - 如何在将数据附加到表tbody时放置动画效果

Question

我有两个按钮，单击每个按钮时，我动态创建 HTML 并将数据附加到表 tbody

这一切都工作正常。

我希望用户感觉到表格内的内容已更改 因此，出于这个原因，我使用了淡入这种方式影响动画

$("#candletable tbody").html(html).fadeIn(999);

但我确实没有看到淡入(动画)效果让用户感觉到表格内的内容已更改

这是我的 fiddle

http://jsfiddle.net/eY8uH/1533/

能否请您告诉我如何让用户感觉到内容已更改。

Answer 1

您正在将 html 数据注入(inject)到页面中，因此一旦您显示它，它就已经显示并且无法淡入。

你可以做的就是先隐藏它，然后淡入

例如

$("#candletable tbody").html(html).hide().fadeIn(999);

Demo

其他一些方法

$("#candletable tbody").hide().html(html).fadeIn(999);

$("#candletable tbody").fadeOut(0).html(html).fadeIn(999);

您还可以使用此功能淡出最后一个表格数据并淡入新数据

$('#candletable tbody').fadeOut('fast', function() {
    $('#candletable tbody').html(html).fadeIn('fast');
});

Demo