Flask无限滚动加载数据失败

Flask infinite scroll loading data fail

本文关键字：数据 失败 加载 滚动 无限 Flask      更新时间：2023-09-26

我用jquery和flask编写了一个无限滚动，但无法加载所有数据。(我想从列表"vocs"中加载10个项目;每时间。)

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

= =比;滚动到底部

11 ~ 20

= =比;滚动到底部

11 ~ 20

= =比;滚动到底部

11 ~ 20

。．.

看起来"vocs"我没想到会跳出来。(很奇怪，pop接缝不工作。每次触发事件，仍从11~20开始

我知道我一定是误解了什么，但我不知道为什么。

<标题>编辑1:

把我的问题收回来，以获得更具体的细节。我得到了"vocs"从服务器开始，它包含从1到100的条目。

当我第一次滚动到底部时，它运行得很好。

1 ~ 10

= =比;滚动到底部

11 ~ 20

但是当我再次回到底部时，情况却出乎我的预料。

= =比;滚动到底部

11 ~ 20

我想我已经记下了所有的"vocs"我想在第一次(它包含1~100)，我不需要从客户端再次获得它。

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>
相关文章：