下拉加载时最近比较流行下拉加载这个效果，自己没事动手实践在phpcms上写了一个，实现还是比较简单，没有修改多少源文件，前端使用的模块化框架layui，都封装好了加载，直接在ajax_append.php文件中按返回的数据格式返回即可
下面直接看我的实例吧
首先在api目录下创建一个ajax_append.php文件，内如如下：
<?php
defined('IN_PHPCMS') or exit('No permission resources.');
/**
* AJAX下拉加载 /api.php?op=ajax_append&modelid=3&catid=1&p=1
*/
$db = '';
$db = pc_base::load_model('content_model');
$MODEL = getcache('model','commons');
$CATEGORYS = getcache('category_content_1','commons');
$modelid = intval($_GET['modelid']);
$pagebase = 20;
$pagenum = 10;
$p = $_GET['p'] ? intval($_GET['p']) : 1;
//v9_picture
$tablename = $db->table_name = $db->db_tablepre.$MODEL[$modelid]['tablename'];
$where = $_GET['catid'] ? "catid = ".intval($_GET['catid']) : 1;
$limit = $pagebase + ($p * $pagenum);
$r = $db->query("SELECT * FROM `$tablename` WHERE $where ORDER BY id DESC LIMIT $limit,$pagenum");
$rs = $db->fetch_array($r);
$total = $db->query("SELECT COUNT(*) AS `count` FROM `$tablename` WHERE $where");
$result = $db->fetch_array($total);
$total = $result[0]['count'] - $pagebase;
$totalpage = round($total/10);
if($totalpage >1 && $p <= 10){
$data = array();
$data['code'] = 1;
$data['msg'] = 'OK';
if($totalpage > 10){
$data['pagetotal'] = 10;
}else{
$data['pagetotal'] = $totalpage;
}
$tablename = $db->table_name = $db->db_tablepre.$MODEL[$modelid]['tablename']."_data";
foreach ($rs as $key => $value) {
$r = $db->get_one(array('id'=>$rs[$key]['id']));
$picnum = count(json_decode($r['pictureurls'], true));
$inputtime = date("Y-m-d",$rs[$key]['inputtime']);
$thumb = $rs[$key]['thumb'].'?x-oss-process=style/midpic';
$catid = $rs[$key]['catid'];
$enjoynum = isset($rs[$key]['digg']) ? $rs[$key]['digg'] : 0;
$catname = $CATEGORYS[$catid]['catname'];
$caturl = $CATEGORYS[$catid]['url'];
$list = <<<EOF
<div class="layui-box">
<div class="layui-actions">
<a class="layui-thumb" href="{$rs[$key]['url']}" target="_blank"><img lay-src="{$thumb}" alt="{$rs[$key]['title']}" /></a>
<div class="layui-infos">
<div class="layui-digg"><i class="layui-heart"></i><span class="layui-badge">{$enjoynum}人喜欢</span></div>
<div class="layui-type"><i class="layui-icon"></i><span class="layui-badge"><a href="{$caturl}" target="_blank">{$catname}</a></span></div>
</div>
</div>
<div class="layui-stats">
<div class="layui-tips">
<div class="layui-piccount"><i class="layui-icon"></i><span class="layui-badge layui-count" data-num="{$picnum}">{$picnum}P</span></div>
<div class="layui-posttime"><i class="layui-icon"></i><span class="layui-badge layui-date">{$inputtime}</span></div>
</div>
<div class="layui-title">
<h2><a href="{$rs[$key]['url']}" title="{$rs[$key]['title']}" target="_blank">{$rs[$key]['title']}</a></h2>
</div>
</div>
</div>
EOF;
$data['list'][$key] = htmlspecialchars($list);
}
}else{
$data['code'] = 0;
$data['msg'] = '数据获取失败，请稍后再试！';
}
echo json_encode($data, JSON_FORCE_OBJECT);
?>然后时我们的首页模板文件，基本没动
{template "content","header"}
<div class="layui-warp">
{pc:get sql="select a.*,b.id,b.pictureurls from phpcms_picture as a left join phpcms_picture_data as b on a.id=b.id where a.status = 99 order by inputtime desc" num="30"}
<div id="masonry" class="container-fluid">
{loop $data $r}
<div class="layui-box">
<div class="layui-actions">
<a class="layui-thumb" href="{$r[url]}" target="_blank"><img lay-src="{$r[thumb]}?x-oss-process=style/midpic" alt="{$r[title]}" /></a>
<div class="layui-infos">
{php $enjoynum = isset($r['digg']) ? $r['digg'] : 0;}
<div class="layui-digg"><i class="layui-heart"></i><span class="layui-badge">{$enjoynum}人喜欢</span></div>
<div class="layui-type"><i class="layui-icon"></i><span class="layui-badge"><a href="{$CATEGORYS[$r[catid]][url]}" target="_blank">{$CATEGORYS[$r[catid]][catname]}</a></span></div>
</div>
</div>
<div class="layui-stats">
<div class="layui-tips">
{php $picnum = count(json_decode($r[pictureurls], true));}
<div class="layui-piccount"><i class="layui-icon"></i><span class="layui-badge layui-count" data-num="{$picnum}">{$picnum}P</span></div>
<div class="layui-posttime"><i class="layui-icon"></i><span class="layui-badge layui-date">{date("Y-m-d", $r[inputtime])}</span></div>
</div>
<div class="layui-title">
<h2><a href="{$r[url]}" title="{$r[title]}" target="_blank">{$r[title]}</a></h2>
</div>
</div>
</div>
{/loop}
</div>
{/pc}
</div>
<div class="layui-link">
<div class="layui-linkbar">
<div class="layui-badge"><i class="layui-icon"></i><h3>友情链接</h3></div>
</div>
{pc:get sql="select * from phpcms_link where passed=1 order by listorder|addtime asc" num="20"}
<div class="layui-linklist">
{loop $data $r}
<a href="{$r[url]}" target="_blank">{$r[name]}</a>
{/loop}
</div>
{/pc}
</div>
<script type="text/javascript" src="{LAYUI_PATH}index.js"></script>
<script type="text/javascript" src="{LAYUI_PATH}uaredirect.js"></script>
{template "content","footer"}最后是我的js文件
layui.use(['flow','jquery'], function(){
var $ = layui.jquery;
var flow = layui.flow;
flow.load({
elem: '#masonry'
,isAuto: false
,isLazyimg: true
,end: '更多图片请查看分类'
,done: function(page, next){
setTimeout(function(){
var lis = [];
$.get('/api.php?op=ajax_append&modelid=3&p='+page, function(res){
var data=eval("("+res+")");
if(data.code == 1){
var arr = Object.keys(data.list);
for(var i = 0; i < arr.length; i++){
var str = data.list[i];
str = str.replace(/&/g, '&');
str = str.replace(/</g, '<');
str = str.replace(/>/g, '>');
//str = str.replace(/"/g, "''");
str = str.replace(/'/g, "'");
str = str.replace(/"/g, "\"");
lis.push(str);
}
next(lis.join(''), page < data.pagetotal);
}else{
return false;
}
});
},500);
}
});
});