Question

我有一个动态填充的jquery scorlling表。我正在使用Bob Craven's jquery scroll solution。

我想要的是当页面加载表时应该在底部，同时当动态添加新行时，这应该是焦点所在。

应用脚本后，它在表格周围创建了div ...这是源代码：

<div style="overflow: hidden; display: inline-block; border: 0px solid rgb(136, 136, 136);" id="placeordetb_table_wrap">
<div style="width: 100%; overflow: hidden;" id="placeordetb_head_wrap">
<table style="table-layout: fixed;" class="placeorder_items" id="placeordetb_head" border="0" cellpadding="0" cellspacing="0" width="100%">
</table>
</div>
<div style="width: 100%; height: 160px; overflow: auto;" id="placeordetb_body_wrap">                     <table class="placeorder_items" id="placeordetb" border="0" cellpadding="0" cellspacing="0" width="100%">
    <tbody>
       <tr valign="top">    
        <th>Line number</th>
        <th>Notes</th>
        <th>Profile</th>
        <th>Inner</th>
        <th>Outer</th>
        <th>Length</th>
        <th>Unit</th>
        <th>Qty</th>
        <th>Line Value (Net)</th>
        <th></th>
       </tr>
       <tr id="10">
       <td>10</td>
       <td style="text-align: center;"></td>
       <td></td><td></td><td></td><td></td><td>6.5</td><td>1</td>
       <td></td>
       <td><a href="javascript:deleteRow(1029,10)">Delete</a></td></tr>
      </tbody>
</table>
</div></div>

正常：

<div  class="placeorder_item">

<table width="100%" cellpadding="0" cellspacing="0" border="0" class="placeorder_items" id = "placeordetb" >
<tr valign="top">   
<th>Line number</th>
<th>Notes</th>
<th>Profile</th>
<th>Inner</th>
<th>Outer</th>
<th>Length</th>
<th>Unit</th>
<th>Qty</th>
<th>Line Value (Net)</th>
<th></th>
</tr>

<tr id="10" >   
<td>10&nbsp;</td>
<td  style="text-align:center;">
    </td>
<td>etc010&nbsp;</td>
<td>1002M&nbsp;</td>
<td>1003&nbsp;</td>
<td>6.500 &nbsp;</td>
<td>L6.5&nbsp;</td>
<td>1&nbsp;</td>
<td>62.52&nbsp;</td>

删除

Answer 1

使用jQuery的.scrollTop()方法动态处理滚动：

$(document).ready(function(){
    var scrollBottom = Math.max($('#placeordetb').height() - $('#placeordetb_body_wrap').height(), 0);
    $('#placeordetb_body_wrap').scrollTop(scrollBottom);
});

有关示例，请参阅以下jsFiddle。

有一个滚动表，想要从滚动的底部开始？

1 个答案: