红穆笔记
首頁 程序筆記 帝國cms 滾動加載更多文章
程序筆記 帝國cms

帝國cms 滾動加載更多文章

帝国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>
微信赞赏

微信

支付宝赞赏

支付寶

✍️ 作者: 紅穆

網站管理員 · 感謝閱讀,更多精彩內容敬請關注

作者主頁 查看主頁 →

相關文章

帝国CMS数据库语句&amp;SQL语句格式

帝國CMS數據庫語句&amp;SQL語句格式 程序筆記 帝國cms

帝國CMS擴展SQL程序編寫介紹,帝國CMS數據庫語句&SQL語句格式基本範例:說明:下面例子都是以PHP文件放在系統根目錄爲基準。例1:連接MYSQL程序。(a.php)&lt;?php require('e/class/connect.php'); //引入數據庫配置文件和公共函數文件 requ…
👁 351
帝国CMS获取系统COOKIE变量函数getcvar()

帝國CMS獲取系統COOKIE變量函數getcvar() 程序筆記 帝國cms

取得系統COOKIE變量函數語法:getcvar($var,$ecms)說明:$var:爲變量名$ecms:0爲設置前臺COOKIE變量,1爲設置後臺COOKIE變量。此參數可省略,默認爲0。使用範例:getcvar('mlusername'),取得前臺登陸會員的用戶名getcvar('loginu…
👁 295
帝国CMS灵动标签调用字段大全

帝國CMS靈動標籤調用字段大全 程序筆記 帝國cms

將所有支持靈動標籤調用的字段收集歸類帝國CMS靈動標籤: [e:loop={欄目ID/專題ID,顯示條數,操作類型,只顯示有標題圖片,附加SQL條件,顯示排序}] 模板代碼內容 [/e:loop]調用時間:&lt;?=date('m-d',$bqr[newstime])?&gt; &lt;?=dat…
👁 3749

推薦閱讀

响应式酒店旅租网站模板 1227

響應式酒店旅租網站模板 1227 實用收藏 易優模板

此套eyoucms響應式模板適用於酒店與旅租行業,設計風格溫馨舒適,能夠展示酒店環境、客房設施、旅租服務及在線預訂。有助於酒店旅租企業在線上吸引遊客,提升品牌知名度。模板展示 安裝說明 網站後臺:/login.php 賬號:admin 密碼:admin 相關文章易優CMS安裝常見問題總結易優CMS(…
👁 46
(自适应手机端)响应式家用电器网站模板 小家电网站源码下载 0969

(自適應手機端)響應式家用電器網站模板 小家電網站源碼下載 0969 實用收藏 pbootcms模板

一款響應式家用電器與小家電PbootCMS網站模板,支持PC與WAP端。設計風格現代實用,適合展示家電產品、品牌故事及促銷活動。有助於家電品牌在線上吸引消費者,提升品牌知名度。模板展示 安裝說明 網站後臺:/admin.php 賬號:admin 密碼:admin 解壓密碼:www.4s5.cn相關文…
👁 60
中医里,咳悸是什么

中醫裏,咳悸是什麼 業餘愛好 中醫術語

在中醫理論中,咳悸通常被認爲是“咳喘”、“心悸”、“胸痛”等症狀的綜合表現。中醫認爲,咳悸是由於痰飲、淤血、火熱等內邪積聚於肺部或心臟部位,導致心肺之氣阻滯不暢所引起的。治療咳悸的關鍵在於清除內邪、通暢氣機、活血化瘀,以達到止咳、平喘、心悸、胸痛等症狀的目的。中醫治療咳悸的方法包括鍼灸、中藥、推拿按…
👁 164
响应式精品美食特色汤盅网站模板 1228

響應式精品美食特色湯盅網站模板 1228 實用收藏 易優模板

一款針對精品美食與特色湯盅行業的eyoucms響應式網站模板。設計風格美食誘人,能夠展示特色菜品、湯盅美食、品牌故事及門店形象。有助於餐飲品牌在線上吸引食客,提升品牌知名度。模板展示 安裝說明 網站後臺:/login.php 賬號:admin 密碼:admin 相關文章易優CMS安裝常見問題總結易優…
👁 56
(自适应手机端)响应式高端卫浴产品网站模板 0970

(自適應手機端)響應式高端衛浴產品網站模板 0970 實用收藏 pbootcms模板

一款響應式高端衛浴產品PbootCMS網站模板,支持PC與WAP端。設計風格現代奢華,適合展示高端衛浴產品、空間設計及品牌形象。有助於衛浴品牌在線上吸引設計師與高端客戶。模板展示 安裝說明 網站後臺:/admin.php 賬號:admin 密碼:admin 解壓密碼:www.4s5.cn相關文章Pb…
👁 50