jquery-ias插件无法与我的网站一起使用,加载更多项目,无法正常工作

时间:2016-05-03 13:09:46

标签: javascript jquery plugins jquery-ias

我将我的网站设置为:

 <div id="posts" class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
            <div class="post post-preview">
                <a href="post.html">
                    <h2 class="post-title">
                        Visualization Data Art
                    </h2>
                    <h3 class="post-subtitle">
                        How to make sense of big data
                    </h3>
                </a>
                <p class="post-meta">Posted by <a href="#">KP</a> on September 24, 2016</p>
            </div>
            <hr>
            <div class="post post-preview">
                <a href="3.html">
                    <h2 class="post-title">
                        About this blog
                    </h2>
                </a>
                <p class="post-meta">Posted by <a href="about.html">KP</a> on September 18, 2016</p>
            </div>
            <hr>
        </div>
         <div id="pagination">
            <a href="2.html">1</a>
            <a href="3.html" class="next">2</a>
        </div>

我的javascript是这样的:

 var ias = jQuery.ias({ container:  '#posts', item: '.post', pagination: '#pagination', next:'.next ' });

当我尝试加载更多内容时,按钮&#34;较旧的帖子&#34;没有给我看任何页面就消失了。我只尝试在网站上找到的基本示例。

1 个答案:

答案 0 :(得分:0)

我的分页看起来不对劲。以下是文档Infinite AJAX Scroll Docs,因为您可以看到&#34; .next&#34;用于链接而不是&#34; li&#34;在你的代码中,你在&#34; li&#34;标签和&#34; a&#34;标签。我假设这个插件的工作方式是它在a标签上查找href然后ajax调用它并抓取它内容然后附加到容器DOM。

def send_file_header(server_type):
    header = "X-Sendfile" if server_type == "apache" else "X-Accel-Redirect"
    return header

@login_required
def show_song(request, pk):
    res =  HttpResponse()
    path = "/path/to/secret/x.mp3"
    response[send_file_header('nginx')] = path
    response['Content-Type']= "application/octet-stream"
    response['Content-Disposition'] = "attachment; filename=\"x.mp3\""
    return response