zoukankan      html  css  js  c++  java
  • thinkphp ajax分页加载更多最简单的实现方法

    <div class="li_list">
    
    <volist name="list" id="vo">
    <div class="line-wrapper">列表内容:{$vo.name}</div>
    </volist>
    </div>
    <div class="page" style="display: none;" id="page">{$page}</div>
    <script type="text/javascript" src="__PUBLIC__/js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="__STATIC__/mobile/js/jquery-ias.min.js"></script>

    调用方法

     var ias = $.ias({
            container: ".li_list",
            item: ".line-wrapper",
            pagination: "#pagination",
            next: "#example1_next a"
        });
        ias.extension(new IASTriggerExtension({offset: 2}));
        ias.extension(new IASSpinnerExtension());
        ias.extension(new IASNoneLeftExtension({html: '<div style="text-align:center;height:60px;"><p><em>己经加载完了</em></p></div>'}));

    完整

    <div class="li_list">
                        
    <volist name="list" id="vo">
    <div class="line-wrapper">列表内容:{$vo.name}</div>
    </volist>
    </div>
    <div class="page" style="display: none;" id="page">{$page}</div>
    
    <script type="text/javascript">
        var ias = $.ias({
            container: ".li_list",
            item: ".line-wrapper",
            pagination: "#pagination",
            next: "#example1_next a"
        });
        ias.extension(new IASTriggerExtension({offset: 2}));
        ias.extension(new IASSpinnerExtension());
        ias.extension(new IASNoneLeftExtension({html: '<div style="text-align:center;height:60px;"><p><em>己经加载完了</em></p></div>'}));
    </script>
  • 相关阅读:
    滚动图片
    Iframe自动适应高度
    我的生活,我的精彩!
    静下心来
    写给关心我的人
    关于考研
    按时间自动刷新页面
    破除网页鼠标右键禁用的十大绝招
    DotNetNuke 皮肤制作白皮书
    WollOp
  • 原文地址:https://www.cnblogs.com/houdj/p/7416482.html
Copyright © 2011-2022 走看看