JQuery下拉列表附加信息幫助

Question

我有一個列出用戶的表。每個表格行都有用戶名稱和位置。我希望能夠點擊表格行並讓用戶的其他信息顯示在爲用戶點擊的表格行的下方，而無需刷新頁面。我使用下面的代碼，但動畫是越野車，我知道必須有一個更好的方式來做到這一點。

 <script type="text/javascript" id="js">$(document).ready(function() { 
// Drop down data on tr click 
$('#users tr').click(function() { 
//Get user ID, must be in first td 
    var userID = $(this).find("td:first").html();  
//Remove any rows being displayed from previous clicks if any 
$('#data-row').remove(); 
//Insert a tr and td spanning all rows as a placeholder (display = none, we will animate next) 
    $(this).after('<tr id="data-row" style="display:none;"><td id="data-cell" colspan="5"></td></tr>'); 
//Show tr created above 
$('#data-row').show('400'); 
//Ajax loading image while we wait for load to return 
$('#data-cell').html('<p><img src="_images/ajax-loader-2.gif" width="220" height="19" /></p>'); 
//Load in data to tr td 
    $('#data-cell').load('admin/main/user_info_box.php?userID='+userID); 
}); 
//Removes Data if Header is clicked to sort rows 
$('th').click(function() { 
    $('#data-row').remove();   
}); 
}); 
</script> 

Answer 1

你可以在開始和.hide（加載所有的用戶信息的）這一切，然後做.slideToggle（）上的點擊，而不是單獨的AJAX調用