jquery insertBefore和fadeIn

Question

我想動畫我的錶行與jquery fadeIn。這是我寫到目前爲止的代碼片段。請告訴我我錯在哪裏。

$("#insert_heading").live("click", function (e) { 
    e.preventDefault(); 
    if ($("#first_msg")) { 
     $("#first_msg").fadeOut(500, function() { 
      $("#first_msg").remove(); 
     }); 
    } 
    if (heading_count >= 6) { 
     alert("you cannot create more than 6 headings"); 
     return false;; 
    } 

    var heading_html = ""; 
    heading_count++; 

    heading_html += '<tr class="heading" id="row_' + heading_count + '">'; 
    heading_html += '<td align="left">&nbsp;Heading ' + heading_count + ':</td>'; 
    heading_html += '<td colspan="3" align="left" valign="middle">'; 
    heading_html += '<input type="text" name="h_' + heading_count + '" class="input validate[required] text-input"/>'; 
    heading_html += '<td align="left" class="heading_delete">'; 
    heading_html += '<a href="#" id="del_' + heading_count + '"><img width="16" height="16" title="Delete" src="images/delete_heading.png"></a></td>'; 
    heading_html += '</td>'; 
    heading_html += '</tr>'; 

    $(heading_html).insertBefore("#submit_button").fadeIn("slow"); 
}); 

Answer 1

在代替您提供您所使用的HTML，我想與你fadeIn代碼的主要問題是，你已經添加的元素，這是明顯的了，所以在fadeIn沒有效果。

我設法通過稍微切換執行順序來實現這個工作。除了使用insertBefore，我用append並拖着fadeIn創造新tr元素：

$('table').append($(heading_html).fadeIn("slow")); 

由此可以看出這裏演示：http://jsfiddle.net/HZwvA/