Question

首先，这不是jQuery fadeIn 'slow' immediately appearing或jQuery fadeIn() doesn't work的重复。我已经尝试了他们的建议并且它无法正常工作。

我试过这个：

$('#tblClues tr:last').after(templateContents).fadeIn(3000);

......我试过这个：

$('#tblClues tr:last').after(templateContents).hide().fadeIn(3000);

附加的html内容不会淡入 - 它会立即显示。救命。（不确定它是否重要，但我正在从templateContents中删除标签，因为它正在抬起渲染表。）

**编辑**

以下是templateContents的全部内容：

<tr id="templateRow2_1" class="MaroonRow">
   <td colspan="2">
      <input type="text" id="txtStepTitle1">
   </td>
</tr>
<tr id="templateRow3_1">
   <td valign="top">
      <textarea id="txtClue1" </textarea>
   </td>
   <td align="center" style="width:150px">
      <span id="spanLinkToPhoto1">
      <button type="button">Link To Photo</button>
      <br>(optional)
      </span>
      <span id="spanPhotoURL1"></span>
   </td>
</tr>
<tr id="templateRow4_1">
   <td colspan="2">
    <span id="tdCoordinates1">Click here.</span>
   </td>
</tr>
<tr id="templateRow5_1">
   <td colspan="2">
      <input type="hidden" id="hidLat1">
   </td>
</tr>

请注意，当我将此附加到我的表格时，jquery会尝试在之前和之后插入<tbody>标记，这会混淆渲染，所以我将其删除。

Answer 1

为div创建隐藏的templateContents容器，将其添加到tr，然后在隐藏的div容器上调用fadeIn

我说您应该遵循Rory的建议，但如果仍想继续使用现有结构，请将display:none;内联样式添加到您的所有tr中（当然有点麻烦），选择所有隐藏的元素，然后显示它们。

var $parent = $('#tblClues');
$parent.find('tr:last').after(templateContents);
$parent.find('tr:hidden').fadeIn(3000);

即时出现jquery fadeIn（）

1 个答案: