0

请我有大约 5000 行实时编辑的数据...
我希望能够显示前 200 行,然后在用户向下滚动页面时显示接下来的 200 行..并且可能隐藏前 200 行。 ..
在stackoverflow上进行了几次搜索之后..我找到了这段代码,但似乎不太了解

    <table id="loadingtable" cellpadding="0" border="1" cellspacing="3" align="center" width="80%">
    <?php
    function createtr($value, $stop)
    {
        while($value <= $stop){
            echo'<tr>';
                echo '<td>';
                    echo "cell {$value}";
                echo '</td>';
            echo '</tr>';
            $value++;
        }
    }
    
    createtr(1, 5000);
    ?>  
    </table>

这是Jquery

       $("#loadingtable tr").slice(100).hide();
       
        var mincount = 100;
        var maxcount = 100; 
    
        $(window).scroll(function() 
        {
            if($(window).scrollTop() + $(window).height() >= $(document).height() - 400) {
                    $("#loadingtable tr").slice(mincount,maxcount).fadeIn(800);
            mincount = mincount+100;
            maxcount = maxcount+100
        
        }
    }); 

该代码不适用于..请多多帮助谢谢..

4

1 回答 1

2
$("#loadingtable tr").slice(100).hide();

    var mincount = 0;
    var maxcount = 100; 

    $(window).scroll(function() 
    {
        if($(window).scrollTop() + $(window).height() >= $(document).height() - 400) {
            $("#loadingtable tr").slice(mincount,maxcount).fadeOut(800);
            mincount = mincount+100;
            maxcount = maxcount+100;
            $("#loadingtable tr").slice(mincount,maxcount).fadeIn(800);

    }
if($(window).scrollTop() <= 200) {
        $("#loadingtable tr").slice(mincount,maxcount).fadeOut(800);
        mincount = mincount-100;
        maxcount = maxcount-100;
        $("#loadingtable tr").slice(mincount,maxcount).fadeIn(800);

}
}); 

当用户滚动到页面底部时,这将加载接下来的 100 行 - 400 像素。要隐藏上述行,您需要先添加一个类似的功能,以便在他开始向上滚动时取消隐藏,然后使用 FadeOut

您需要添加对边界条件的检查(mincount < 0 和 maxcount > 5000)

于 2013-03-04T08:08:36.570 回答