联系官方销售客服

1835022288

028-61286886

求助 版主:论坛审计组
瀑布流Aajx加载更多,滚动浏览器自动下一页如何做呢
类型:迅睿CMS 更新时间:2019-10-26 09:09:41
回帖
  • 代办商标
    #1楼    代办商标
    2019-10-25 21:27:04
    Chrome 0
    是不是访问手机网站界面
  • ibennie
    #2楼    ibennie
    2019-10-26 09:08:05
    Chrome 0
    参考 \template\mobile\default\home\list.html
  • ibennie
    #3楼    ibennie
    2019-10-26 09:09:41
    Chrome 0
    ibennielist.html
    <div class="page-content">
    
        <div class="search-page search-content-1">
    
            <div class="search-container">
                <!--分页显示列表数据-->
                <ul class="search-container" id="content_list">
                    {template "list_data.html"}
                </ul>
    
            </div>
    
            <div class="margin-top-20" id="is_ajax_btn">
                <a href="javascript:dr_ajax_load_more();" class="btn default btn-block"> 加载更多 </a>
            </div>
        </div>
    
    </div>
    
    <script>
        var Mpage=1;
        //滚动显示更多
        var scroll_get = true;  //做个标志,不要反反复复的加载
        $(document).ready(function () {
            $(window).scroll(function () {
                if (scroll_get==true &&  (400 + $(window).scrollTop())>($(document).height() - $(window).height())) {
                    scroll_get = false;
                    layer.msg('内容加截中,请稍候',{time:1000});
                    dr_ajax_load_more();
                }
            });
        });
    
        function dr_ajax_load_more(){
            Mpage++;
            $.get('/index.php?s=api&c=api&m=template&name=list_data.html&module={MOD_DIR}&catid={$catid}&format=json&page='+Mpage+'&'+Math.random(),function(res){
                $('.footer-cont').hide();
                if(res.code==1){
                    if(res.msg==''){
                        $('#is_ajax_btn').hide();
                        layer.msg("已经显示完了",{time:500});
                    }else{
                        $('#content_list').append(res.msg);
                        scroll_get = true;
                    }
                }else{
                    layer.msg(res.msg,{time:2500});
                }
            }, 'json');
        }
    </script>
    list_data.html
    {module catid=$catid order=updatetime page=1}
    <li class="search-item clearfix">
        <a title="{$t.title}" href="{$t.url}">
            <img src="{dr_thumb($t.thumb, 100, 90)}" width="100" height="90" style="margin-top: 15px;">
        </a>
        <div class="search-content text-left">
            <h4 class="search-title">
                <a title="{$t.title}" href="{$t.url}">{dr_strcut($t.title, 20)}</a>
            </h4>
            <p class="search-desc">{dr_strcut($t.description, 44)}</p>
        </div>
        <div class="search-post-foot">
            <a href="{dr_cat_value('news',$t.catid, 'url')}"><i class="fa fa-list"></i> {dr_cat_value('news',$t.catid, 'name')}</a>
            <a href="{$t.url}"><i class="fa fa-calendar"></i> {$t.updatetime}</a>
        </div>
    </li>
    {/module}