Question

我有如下表格。问题我有一个ajax脚本，运行如下

$.post('getDt.php', {a: ""}, function(data){

            $('#updateData').html(data);

         }

将表体内容动态填充到div #updateData中。不幸的是，div总是出现在表格内容之上。根据定义，它永远不会被填充到身体部分。如何强迫它出现在身体而不是桌子顶部？

 <div class="box-content">
                                <table class="table table-striped table-bordered bootstrap-datatable " style='font-size:10px;table-layout: fixed;'>
                              <thead>
                                  <tr>
                                      <th style='width: 10%;'>No.</th>
                                      <th style='width: 15%;'>NT</th>
                                      <th style='width: 20%;'>SE</th>
                                      <th style='width: 20%;'>VH</th>

                                      <th style='width: 18%;'>Status</th>
                                  </tr>
                              </thead>   
                              <tbody>
                              <div id="updateData">

                              </div>
                              </tbody>
    </div>

Answer 1

<tbody>元素只能包含<tr>元素。

我建议您创建一行（tr）和一个单元格（td）并将<div>元素放入其中。
除非您从AJAX调用返回的数据是实际行，否则我将id属性移动到<tbody>元素并删除<div>元素。

<div class="box-content">
                                <table class="table table-striped table-bordered bootstrap-datatable " style='font-size:10px;table-layout: fixed;'>
                              <thead>
                                  <tr>
                                      <th style='width: 10%;'>No.</th>
                                      <th style='width: 15%;'>NT</th>
                                      <th style='width: 20%;'>SE</th>
                                      <th style='width: 20%;'>VH</th>

                                      <th style='width: 18%;'>Status</th>
                                  </tr>
                              </thead>   
                              <tbody id="updateData">
                              </tbody>
    </div>

将tbody更新为div内容

1 个答案: