jQuery实现局部区域滚动条滚动到底部自动加载数据的问题总结与实现方法

1 需求背景

在我们做管理系统，需要从后台数据库取出数据显示到前台时，可能我们的做法就是将数据全部取出然后利用jQuery动态添加到表格当中，但是当我们取出的量非常大时问题就出现了，我们会发现页面加载的速度非常慢，这时我们就可利用分页或者这种监听滚动条来自动加载数据，这种技术也称为“懒加载”

2 实现过程中遇到的问题总结

（1）首先就是在滚动条滚动到底部之后，监听事件被多次触发。这个问题的解决方式就是通过设置一个标志，当滚动条滚动到底部并且标志为真时，启动加载数据事件，在进入动态加载数据时将标志设置为假，加载数据成功后，在设置为真。
（2）其次，这里ajax是异步加载数据的，我们发现虽然给我们自动加载数据了但是他并不是按照我们请求的顺序加载出来的，这是我们的解决方法就是将ajax改成同步，从而解决了这个问题。

3 部分代码实现

（1）前台html

<div id="infolist" data-spy="scroll" class="articlefoot table-responsive">
    <table id="tabalelist" class="table text-nowrap">
        <caption>文章列表</caption>
        <thead>
            <tr>
                <th>编号</th>
                <th>文章名称</th>
                               <th>类型</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody id="menu1body">
        </tbody>