• 帝国cms 滚动加载更多整合


    想要自己加载得要涉及到PHP+JQ+AJAX:

    新建个php代码get_news_index.php 上传到 /e/action:

    <?php
    require('../class/connect.php');
    require('../class/db_sql.php');
    require('../data/dbcache/class.php');
    if($_POST[action] == 'getmorenews'){
    $table=htmlspecialchars($_POST[table]);
    if(empty($_POST[orderby])){$orderby='newstime';}else{ $orderby=htmlspecialchars($_POST[orderby]);}
    if(empty($_POST[myorder])){$myorder='desc';}else{ $myorder='asc';}
    if(empty($_POST[limit])){$limit=3;}else{ $limit=(int)$_POST[limit];}
    if(empty($_POST[classid])){$where=null;}else{ $where='where classid in('.$_POST[classid].')';}
    if(empty($_POST[length])){$length=50;}else{ $length=(int)$_POST[length];}
    if(empty($_POST[small_length])){$small_length=120;}else{ $small_length=(int)$_POST[small_length];}

    $link=db_connect();
    $empire=new mysqlquery();
    $num =(int)$_POST['next'] *$limit;

    if($table){
    $sql=$empire->query("SELECT * FROM `".$dbtbpre."ecms_".$table."` $where order by $orderby $myorder limit $num,$limit");

    while($r=$empire->fetch($sql)){

    if($r[titlepic]==''){
    $r[titlepic]=$public_r[news.url]."e/data/images/notimg.gif";
    }
    $oldtitle=stripSlashes($r[title]);
    $title=sub($oldtitle,'',$length);
    $smalltext=stripSlashes($r[smalltext]);
    $smalltext=sub($smalltext,'',$small_length);
    $classname=$class_r[$r[classid]][classname];
    $newsurl=$public_r[newsurl];
    $classurl=$newsurl.$class_r[$r[classid]][classpath];

    ?>
    <article class="excerpt excerpt-one" data-id="<?=$r[classid]?>">
    <header><a class="cat label label-important" href="<?=$class_r[$r[classid]]['classpath']?> "><?=$class_r[$r[classid]][bname]?><i class="label-arrow"></i></a>
    <h2><a href="<?=$r[titleurl]?>" title="<?=$r[oldtitle]?>"><?=$r[title]?></a></h2>
    <small class="text-muted"><span class="glyphicon glyphicon-picture"></span><?=$r[imgcount]?></small></header>
    <p class="text-muted time"><?=$r[username]?> 发布于 <?=date('Y-m-d',$r[newstime])?></p>
    <p class="focus"><a href="<?=$r[titleurl]?>" class="thumbnail"><img src="<?=$r[titlepic]?>" /></a></p>
    <p class="note"><?=$smalltext?>...</p>
    <p class="text-muted views">
    <span class="post-views">阅读(<?=$r[onclick]?>)</span>
    <span class="post-comments">评论(<?=$r[plnum]?>)</span><a href="JavaScript:makeRequest('<?=$public_r[news.url]?>e/public/digg?classid=<?=$r[classid]?>&id=<?=$r[id]?>&dotop=1&doajax=1&ajaxarea=diggnum<?=$r[id]?>','EchoReturnedText','GET','');" class="post-like" ><i class="glyphicon glyphicon-thumbs-up"></i>赞 (
    <span id="diggnum<?=$r[id]?>"><?=$r[diggtop]?></span>)</a>
    <span class="post-tags">标签:<a href="/337/e/tags/?tagname=<?=stripSlashes($r[keyboard])?>" target="_blank" rel="tag" data-original-title><?=stripSlashes($r[keyboard])?></a></span></p>
    </article>

    //这部分代码添加自己的模板代码
    <?php
    }
    }
    }
    db_close();
    $empire=null;
    ?>

    第二部要写js代码 ajaxShow.js:

    $(function() {
    var i =0; //设置当前页数
    if (!NeuF) var NeuF = {};
    NeuF.ScrollPage = function (obj, options, callback) {
    var _defaultOptions = {delay: 500, marginBottom: 200}; //默认配置:延迟时间delay和滚动条距离底部距离marginBottom
    options = $.extend(_defaultOptions, options);
    this.isScrolling = false; //是否在滚动
    this.oriPos = 0; //原始位置
    this.curPos = 0; //当前位置
    var me = this; //顶层
    var $obj = (typeof obj == "string") ? $("#" + obj) : $(obj);
    //绑定滚动事件
    $obj.scroll(function (ev) {
    me.curPos = $obj.scrollTop();
    if ($(window).height() + $(window).scrollTop() >= $(document.body).height() - options.marginBottom) {
    if (me.isScrolling == true) return;
    me.isScrolling = true;
    setTimeout(function () {
    me.isScrolling = false;
    }, options.delay); //重复触发间隔毫秒
    if (typeof callback == "function") callback.call(null, me.curPos - me.oriPos);
    }
    ;
    me.oriPos = me.curPos;
    });
    };
    $(function () {
    window.scrollTo(0, 0); //每次F5刷新把滚动条置顶
    function show() {
    $.ajax({
    url: 'http://www.****.com/e/action/get_news_index.php',//自己的域名
    type: 'POST',
    data: {
    "next": i,
    'table': 'news',
    'action': 'getmorenews',
    'limit': 10,
    'small_length': 120
    },
    dataType: 'html',
    beforeSend: function () {
    $("#loadmore").show().html('<img src="/307/skin/ecms103/images/loading.gif"/>正在努力加载中...');

    $('#loadmore').attr('disabled', 'disabled');
    },
    success: function (data) {
    if (data) {
    $("#showajaxnews").append(data);

    $("#loadmore").removeAttr('disabled');
    $("#loadmore").html('滚动加载更多');
    i++;
    } else {
    $("#loadmore").show().html("已全部加载完毕!");
    console.log(data);
    $('#loadmore').attr('disabled', 'disabled');
    return false;
    }
    }
    });

    };
    show();
    //marginBottom表示滚动条离底部的距离,0表示滚动到最底部才加载,可以根据需要修改
    new NeuF.ScrollPage(window, {delay: 1000, marginBottom: 0}, function (offset) {
    if (offset > 0) {
    setTimeout(show,1000)
    }
    });
    });
    });
    第三部要在 HTML 加入代码:
    <div id="showajaxnews">
    列表加载这里面
    </div>
    <div id="loadmore">滚动加载更多</div>


  • 相关阅读:
    162. 寻找峰值
    152. 乘积最大子数组
    MAT 下载及安装
    Netty NIO基础
    MySQL insert into V.S. replace into
    Netty NIO 之 阻塞模式/非阻塞模式/多路复用
    Python 函数参数*args和**kwargs
    Netty NIO之ByteBuffer
    Python numpy 和 pandas
    Financial 协方差 Covariance
  • 原文地址:https://www.cnblogs.com/zhpblog/p/9372914.html
Copyright © 2020-2023  润新知