账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
  • 举报
    X
    齐博列表页制作及无滚动加载内容
    30
    0

    代码如下:

    <div class="listpages">
    {qb:listpage name="bbs_list_page_pc" rows="20" order="list"}
    <a href="{:urls('content/show',['id'=>$rs['id']])}">{$rs.title}</a> 
    {/qb:listpage}
    </div>
    <!--{$pages} 这是传统分页-->
    <button type="button" onclick="ShowMoreList()">查看更多</button>
    
    <script type="text/javascript">
    var Mpage = 1;
    //显示更多
    function ShowMoreList(){
    Mpage++;
    $.get('{qb:list_url name="bbs_list_page_pc" /}'+Mpage,function(res){
    if(res.code==0){
    if(res.data==''){
    layer.msg("已经显示完了!",{time:500});
    }else{
    $('.listpages').append(res.data);
    scroll_get = true;  //这一行仅仅是匹配滚动显示更多.如果没使用滚动特效,可以删除
    }
    }else{
    layer.msg(res.msg,{time:2500});
    }
    });
    }
    
    //滚动显示更多
    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});
    ShowMoreList();
    }
    });
    });
    
    </script>


    下面这一段,就是齐博标签中的列表页标签代码

    <div class="listpages">
    {qb:listpage name="bbs_list_page_pc" rows="20" order="list"}
    <a href="{:urls('content/show',['id'=>$rs['id']])}">{$rs.title}</a> 
    {/qb:listpage}
    </div>


    他的标志就是 {qb:listpage name="xxxx"}模板{/qb:listpage}

    而通用标签是{qb:tag name="xxxx"}模板{/qb:tag}

    其它参数的用法都基本一样,这里就是唯一不同的地方即:冒号后面的几个字母

    {$pages}


    这个是传统分页的代码,现在慢慢不太受喜欢了.体验比较差


    这个是点击事件,如果你使用了滚动事件的话,这个就没有存在的意义.

    var Mpage = 1;
    //显示更多
    function ShowMoreList(){
    Mpage++;
    $.get('{qb:list_url name="bbs_list_page_pc" /}'+Mpage,function(res){
    if(res.code==0){
    if(res.data==''){
    layer.msg("已经显示完了!",{time:500});
    }else{
    $('.listpages').append(res.data);
    scroll_get = true;  //这一行仅仅是匹配滚动显示更多.如果没使用滚动特效,可以删除
    }
    }else{
    layer.msg(res.msg,{time:2500});
    }
    });
    }


    上面这一段是JS代码,大部分页面都可以套用的.var Mpage = 1;这个是页码默认表示当前已显示了第一页

    {qb:list_url name="bbs_list_page_pc" /}


    这个代表分页网址,这也是齐博标签最特别的地方, 按以往,甚至现在很多同行, 为了实现分页显示数据,必须要单独做一个PHP文件写数据调用.而我们这里,只需要把显示标签的变量名复制到这里让他们一一对应,就可以解决了

    这个分页网址标签在页面运行后,会转义成类似下面的网址

    http://你的域名/index.php/bbs/content/ajax_get/name/bbs_list_page_pc/fid/16/mid/1/rows/20/order/list/by/desc/pagename/ec1e7a01/cache_time/0.html?page=

    这个不需要你去记住,只是让大家知道,最后他会生成一个很特别的网址,带上各项参数并且以=号结尾,=号后面就必须要跟上页码数字


    下面这一段,就是实现滚动显示更多的,如果你不想滚动显示更多,而想点击显示更多的话,就可以把下面这一段删除掉.

    //滚动显示更多
    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});
    ShowMoreList();
    }
    });
    });


    使用本站前必读
     1,本站提供的资源来源网络收集或网友发布到本站,仅供学习研究之用,其版权归版权方所有,
     切勿用于商业用途和非法行为否则后果自负。请在24小时之内自行删除!若您需要商业运营或用于其他商业活动,请您购买正版
     授权并合法使用。
     2,本文内容仅代表作者本人观点,并不代表本站赞同其观点和对其真实性、完整性、合法性负责,作者文责自负。
     3,本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报。
     4,本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间退回积分、金币或者更新。
     5,如您认为本文侵犯了您的合法版权,请点击 版权投诉 进行投诉,我们将在确认本文链接指向的资源存在侵权后,立即删除
     6,多爱丽提醒您:在使用本站前,请您务必仔细阅读并透彻理解使用多爱丽前必读。您可以选择不使用多爱丽,但如果您使用多爱丽,您的使用行为将被视为对使用多爱丽前必读全部内容的认可。点我阅读并透彻理解使用多爱丽前必读
     7,本站提供的资源来源网络收集或网友发布到本站,仅供学习研究之用,有bug正常(比如一个装备不能合或者不能回收、地图不全、缺少插件或角本......),只要能进游戏就算正常。你下载的资源是无售后 无售后 无售后的,不能接受的请勿下载。
     8, 游戏版本你花金币下载后,无法进游戏,请报报错,并说明原因,站长会退回您已经支付的金币到您本站账户上。
    0
    赏钱
    收藏
    点击回复
        全部留言
    • 0
    更多回复
        你可能感兴趣的主题
    恢复多功能编辑器
  • 3 1
  • 推荐内容
    扫一扫访问手机版