追加数据加载的问题

Question

我的HTML是这样

<div id="rsContainer"> 
     <table id="rsTable"><!-- DATA HERE --></table> 
</div> 

，我的JavaScript是这样

$('#UpdateAll').click(function() { 

     $('#status').fadeIn('500').text('Loading... This may take a while.'); 
     $.ajax({ 
     type: 'post', 
     url: 'func.php', 
     data: 'action=updateAll', 

     success: function(response) { 
      $('#response').fadeOut('500').fadeIn('500').append(response); 

      $('#rsTable').slideUp('1000').load('index.php #rsTable', function() { 
       $(this).appendTo('#rsContainer').slideDown('1000'); 
      }); 

      $('#status').fadeOut('500').empty(); 
     } 
     });  
    }); 

这工作正常，但经过appening的HTML看起来像这样

<div id="rsContainer"> 
     <table id="rsTable"> 
      <table id="rsTable"><!--data--></table> 
     </table> 
</div> 

正如你可以看到它实际上附加到rsTable我该如何维护原来的结构？

谢谢。

Answer 1

$('#rsContainer').slideUp('1000').load('index.php #rsTable', function() { 
    $(this).slideDown('1000'); 
}); 

将slideUp id更改为父ID。

Answer 2

在我运行的测试中，在.prepend（）之前执行.emtpy（）的速度比执行.html（）要快200％。奇怪而真实。

如果你的意图是同时拥有rsTable，你应该为id添加一个计数器或者使用一个类，因为id必须是唯一的。

看起来你想这样做，但：

$('#rsContainer').empty(); 
$('#rsContainer').prepend($('#rsTable'));