编辑1：

Question

我用jquery和flask写了一个无限滚动，但是不能加载所有数据。（我想从列表中加载10个项目＆＃34; vocs＆＃34;每次。）

的Jinja2：

<tbody id="xxx">
{% for _ in range(0,10) %}
    <tr>
        {% for i in vocs.pop(0) %}
            <td>{{ i }}</td>
        {% endfor %}
    </tr>
{% endfor %}
</tbody>

jquery的：

<script>
    $(window).scroll(function () {
        if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
            var c = '';
            {% for _ in range(0,10) %}
                c += '<tr>';
                {% for i in vocs.pop(0) %}
                    c += ('<td>' + '{{ i }}' + '</td>');
                {% endfor %}
                c += '</tr>';
            {% endfor %}
            $('#xxx').append(c);
        }
    });
</script>

每次滚动到底部时，我都得到了这个结果：

1〜10

==＆GT;滚动到底部

11〜20

==＆GT;滚动到底部

11〜20

==＆GT;滚动到底部

11〜20

。。

它接缝＆＃34; vocs＆＃34;突然出现在我的期待中。（流行接缝不起作用很奇怪。每当我触发事件时，它仍然从11~20开始）

我知道我必须误解某些事情，但我不知道为什么。

编辑1：

回收我的问题以获取更具体的细节。我得到了＃34; vocs＆＃34;从服务器开始，它包含1~100的项目。

当我第一次滚动到底部时，效果很好。

1〜10

==＆GT;滚动到底部

11〜20

但当我再次流口水时，情景并非在我的期待中。

==＆GT;滚动到底部

11〜20

我想我已经获得了所有＆＃34; vocs＆＃34;我想第一次（它包含1~100），我不需要再从客户那里拿到它。

Answer 1

Jinja2：模板似乎是正确的。我用简单的范围检查了代码，当我向下滚动时，它正确地为我加载。也许你应该检查一下vocs。问题应该是那个。

<table>
    <tbody id="xxx">
    {% for _ in range(0,10) %}
        <tr> 
            {% for i in range(1,6) %}
                <td>{{ _ }} - {{ i }}<br/><br/><br/><br/><br/></td>
            {% endfor %}
        </tr>
    {% endfor %}
    </tbody>
</table>

JQuery：

<script>
    $(window).scroll(function () {
        if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
            var c = '';
            {% for _ in range(0,10) %}
                c += '<tr>';
                {% for i in range(1,6) %}
                    c += ('<td>' + '{{ _ }}{{ i }}' + '</td>');
                {% endfor %}
                c += '</tr>';
            {% endfor %}
            $('#xxx').append(c);
        }
    });
</script>

Flask无限滚动加载数据失败

编辑1：

1 个答案: