本帝国cms插件使用Ajax完成无改写加载更多的列表信息,用检查更多按钮来代替翻页功用,无限加载。

服务端源码:(保存途径为/e/action/get_news_index.php)

<?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=15;}else{$limit=(int)$_POST[limit];}
if(empty($_POST[classid])){$where=null;}else{$where='whereclassidin('.$_POST[classid].')';}
if(empty($_POST[length])){$length=50;}else{$length=(int)$_POST[length];}
if(empty($_POST[small_length])){$small_length=500;}else{$small_length=(int)$_POST[small_length];}
$link=db_connect();
$empire=newmysqlquery();
$num=(int)$_POST['next']*$limit;
if($table){
$sql=$empire->query("SELECT*FROM`".$dbtbpre."ecms_".$table."`$whereorderby$orderby$myorderlimit$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];
?>
<pclass="latest_news_listfixed">
<pclass="news_cover">
<ahref="<?=$r[titleurl]?>"target=_blank><imgsrc="<?=$r[titlepic]?>"width=160height=100/></a>
</p>
<pclass="news_text">
<h3><ahref="<?=$r[titleurl]?>"target=_blank><?=$r[title]?></a></h3>
<p><?=$smalltext?></p>
<p><spanclass="timmerfr"><?=date("Y-m-d",$r[newstime])?></span><ahref="<?=$classurl?>"><?=$classname?></a></p>
</p>
</p>
<?php
}
}
}
db_close();
$empire=null;
?>

前端JS脚本完成代码:

$(function(){
vari=1;//设置当时页数
$('#loadmore').on('click',function(){
$.ajax({
url:'/e/action/get_news_index.php',
type:'POST',
data:{"next":i,'table':'news','action':'getmorenews','limit':15,'small_length':120},
dataType:'html',
beforeSend:function(){
$("#loadmore").show().html('<imgsrc="/e/extend/Ajaxpl/template/loading1.gif"width=80/>正在尽力加载中...');
$('#loadmore').attr('disabled','disabled');
},
success:function(data){
if(data){
$("#showajaxnews").append(data);
$("#loadmore").removeAttr('disabled');
$("#loadmore").html('点击加载更多');
i++;
}else{
$("#loadmore").show().html("已悉数加载结束!");
$('#loadmore').attr('disabled','disabled');
returnfalse;
}
}
});
});
});


ajax恳求服务端参数阐明

next:第几页

table:调用数据表

limit:每次调用数量

small_length:简介截取字符数

length:标题截取字符数

classid:调用栏目,答应多个,如1,2,3,4 特别注意,有必要是调用同一数据表的栏目

orderby:排序,默许是newstime,传什么就按什么来排序,如 id

myorder:正反序,默许是asc,传值怎为desc

除此之外还需求有一个按钮来载入更多

<buttonid="loadmore">点击加载更多内容</button>

还需求一个烘托数据的元素(id="showajaxnews")点击加载更多按钮后获取到的数据会追加到showajaxnews元素里边,在点击载入按钮之前咱们需求预放一下数据在里边,这样的话翻开页面就有部分数据,点击载入按钮后追加到结尾!

<pid="showajaxnews"></p>

参阅模板代码:


本插件是在jQuery下完成,请必须引进jquery,不然不能正常运转!


声明:有的资源均来自网络转载,版权归原作者所有,如有侵犯到您的权益 请联系邮箱:123456@qq.com 我们将配合处理!

原文地址:帝国CMS二次开发无刷新Ajax加载更多列表信息插件发布于2022-06-12 07:43:39

相关推荐