Jquery追加超过最大高度

时间:2017-05-17 06:41:31

标签: javascript jquery html css

我有一个jquery代码,它遍历一个对象列表并将html附加到一个表。但是我已经设置了父/表的最大高度。表格行仍然超过父级。

记录应停在图片中的红线显示处,并且应显示滚动条。

任何人都可以提供帮助吗?

Jquery的

$.each(data, function (i, item) {
     $('#dataTable').append("<tr><td>" + i + '</td><td>' + item.name+ '</td><td>' + item.English + '</td><td>' + item.Quantity + '</td><td>' + item.Brand + '</td></tr>')
});

HTML

<div class="panel panel-default" style="height:700px;">
   <div class="panel-heading">Records</div>
   <div class="panel-body" style="max-height:700px; z-index:5;">
      <table id="dataTable" class="table" style="height:700px;overflow:auto;">
         <tr>
            <th>S/N</th>
            <th>name</th>
            <th>Description</th>
            <th>Qty</th>
            <th>Brand</th>
         </tr>
      </table>
   </div>
</div>

enter image description here

1 个答案:

答案 0 :(得分:2)

从表格标记height:700px;overflow:auto;中删除以下样式案例,并在类overflow:auto;中应用.panel-body样式案例。 overflow:auto;样式案例无法在表格标记中使用。