0

我有一张这样的桌子

<table>
<thead>
      <tr>
           <td>col_1</td><td>col_2</td><td>col_3</td>
      </tr>
</thead>

<tbody id="content">
      <tr>
           <td>cell_1_1</td><td>cell_1_2</td><td>cell_1_3</td>
      </tr>
</tbody>
</table>
<button id="ref" value="Refresh" />

我只想加载<tbody>使用 ajax 的内容。这是我的脚本

$("ref").click(function(){
$.post("ajax.php",
function(data)
{
    $("#content").html(data)    
})
});

ajax.php 文件是这样的

echo ' <tr>
           <td>cell_1_1</td><td>cell_1_2</td><td>cell_1_3</td>
       </tr>';

但是当我加载它时,加载的数据会失去它们作为表格“tr”和“td”的样式。我知道它有什么问题,当我将它作为一个完整的“表格”加载时它可以工作。但是,有没有<tbody>单独加载的想法???

4

1 回答 1

1

我强烈建议使用$.ajax它,因为它更可定制:

$("ref").click(function(){
    $.ajax({
        url:'ajax.php', // URL of where AJAX should POST the data
        type: 'POST', // Send a POST to server
        data: {'id': 3243}, // Data to be POSTED to server. In PHP use echo $_POST['id']; to see what the AJAX passed in
        dataType: 'HTML', // Expected data from server
        success: function(data){
            console.log(data); // <-- view what the server sent back to AJAX
            // OR
            alert(data);  // <-- view what the server sent back to AJAX

            $("#content").html(data);
        }
    });
});

编辑:

我仍然建议使用 AJAX,但在阅读了更多评论后,我有一个问题:

您是否在像这样初始加载后使用 jQuery 来格式化表格?

$('table tbody tr td').css({'padding':'10px'});

因为如果是,那么您需要$("#content").html(data);像这样重复它:

$("#content").html(data);
$('table tbody tr td').css({'padding':'10px'});

这样做的原因是因为.css()样式元素处于内联级别,因此当您刷新 HTML() 时,那些<td>' 会丢失它们的样式。您应该在 CSS 文件中声明样式,以确保它不会在刷新时丢失。

于 2013-10-21T15:27:40.927 回答