jQuery 在 table 中找到最接近的值并滚动到它所在的行

Question

我有一个 table 加载 ajax 寻找：

   <div id="Dprg">
    <table>
        <tr><td ord="1">06:00</td><td>Event 1</td></tr>
        <tr><td ord="2">06:30</td><td>Event 2</td></tr>
        <tr><td ord="3">06:45</td><td>Event 3</td></tr>
        <tr><td ord="4">07:00</td><td>Event 4</td></tr>
        <tr><td ord="5">07:30</td><td>Event 5</td></tr>
        <tr><td ord="6">08:25</td><td>Event 6</td></tr>
        <tr><td ord="7">08:45</td><td>Event 7</td></tr>
        <tr><td ord="8">09:10</td><td>Event 8</td></tr>
                    ....etc...
        <tr><td ord="58">00:30</td><td>Event 58</td></tr>        
    </table>
  </div>

此 table 以 10%（window 大小）的高度 div 查看。我希望在 div 中加载 table 后滚动到实际的运行事件：获取实际时间并将其与第一个时间进行比较并滚动到它。这是我的 Jquery 函数，用于在 ajax 文件加载后滚动，它对第一个加载的文件运行正常（甚至不准确）但是如果我将另一个程序加载到那个 div ..它滚动错误：

   function scrollinfo(){
    var dt = new Date();
    var time = dt.getHours() + ":" + (dt.getMinutes()<10?'0':'')+ dt.getMinutes();  
    $('#Dprg tr').each(function() {
    var myst = $(this).find("td").eq(0).html();   
    if (myst >= time){$('#Dprg').animate({scrollTop: $(this).offset().top-($('#Dprg').height()/2)}, 1000 );return false;}
    }); 
    }

非常感谢您的帮助。

Answer 1

所以没有人回答，如果其他人在这里有类似的问题，解决方案：使用 ajax 加载数据后，我不得不将 div 重新滚动到顶部（滚动到0) 这将是初始步骤。比我必须更好地考虑分钟和小时的时间（如果 <10，则添加“0”）。最后是第 3 列，它将保存每个事件的结束时间（3 列 table 而不是 2 列）。而已！这是最终函数：

function scrollinfo(){
$('#Dprg').scrollTop(0); //very important 
var dt = new Date();
var time = (dt.getHours()<10?'0':'')+(dt.getHours()+ ":" + 
 (dt.getMinutes()<10?'0':'')+ dt.getMinutes();

$('Table tr').each(function() {
var beg = $(this).find("td").eq(0).html(); 
var fin = $(this).find("td").eq(2).html(); 
if (beg <=time && time <=fin){  
    $('#Dprg').animate({scrollTop: $(this).offset().top}, 1000 );
    return false;
    }       
    }); 
}

为了最终确定这个想法，我在 table 中添加了一个 onmouseleave="scrollinfo();"，手动滚动后它会再次回到正确的行（实际运行事件）..而且运行顺利！谢谢 Whosebug 大家庭，保重 :-) !.

jQuery 在 table 中找到最接近的值并滚动到它所在的行

jQuery locate closest value in a table and scroll to its row

jquery

html-table

filter

scrolltop