jquery 滚动条到底部执行方法问题.

Posted 2023-03-14

js: $("tr:eq(2)").nextAll().hide();//首先将前面三个tr默认显示
然后当滚动条到底部后如何把第44444，55555，66666显示，如此类推。。。。。

<table>
<tr><td>111111</td></tr>
<tr><td>22222</td></tr>
<tr><td>33333</td></tr>
<tr><td>44444</td></tr>
<tr><td>55555</td></tr>
<tr><td>66666</td></tr>
<tr><td>77777</td></tr>
<tr><td>88888</td></tr>

</table>

参考技术A 给你个思路：
1、获取滚动事件；
2、判断隐藏掉的第一个tr与它所在的索引；
3、计算第一个隐藏的tr离窗口顶部的距离；
4、当计算到的距离小于某个值(PS:此值自定义)时显示此隐藏tr及其后的另外两个tr

具体实现：
$(function()
$("table tr:gt(2)").hide();
$(window).scroll(function()
var firstHideTr = $("tr:hidden:first"); //隐藏掉的表格第一行
var index = $("table tr").index(firstHideTr); //判断隐藏掉的表格第一行所在的索引值
if(firstHideTr.length>0 && ((firstHideTr.prev("tr").offset().top-$(window).scrollTop())<300))//此值300为自定义，根据实际情况而定
for(var i=0;i<3;i++)//3为滚动时显示的行数，可根据实际去定义
$("table tr").eq(index+i).show()


);
);本回答被提问者采纳 参考技术B 你可以参考下淘宝图片下拉显示的效果