我正在尝试使用.slideDown为现有表添加“display:none”的表行设置动画。出现了新的tr,但它没有做任何动画。 FadeIn完美地工作。 我不知道该怎么做,我想使用那个特定的动画。
这是代码和jsfiddle:https://jsfiddle.net/p97ekp7g/1/
HTML
<div id="timesSection">
<table id="tableTimes">
<tr>
<th class="number0">#</th>
<th>E</th>
<th>P</th>
</tr>
<tr>
<td class="number1">1</td>
<td>35</td>
<td>91</td>
</tr>
</table>
</div>
的js
function insertAfterLastChild() {
var i = 0;
// search for last row
$('table tr td:first-child').each(function () {
var n = $(this).text();
if (n > i) {
i = n
}
});
i++; // increase index to add code in a new row
var stringClassNumber = 'number' + i;
var string = '<tr style="display: none"><td class="' + stringClassNumber + '">' + i + '</td><td>10</td><td>10</td></tr>';
$(string).appendTo($('#tableTimes tbody'));
setTimeout(function () {
$('#tableTimes tbody tr:last-child').slideDown(1000);
}, 1000)
}
insertAfterLastChild();
谢谢。