生活 list.php,list.php

require_once 'config.php';

// 接收传来的分类id

$categoryId=$_GET['categoryId'];//3

// 查询当前分类下的文章

// echo $categoryId;

// 连接数据库

$connect=mysqli_connect(DB_HOST,DB_USER,DB_PWD,DB_NAME);

// 写sql

$sql="select p.id,p.title,p.feature,p.content,p.created,

p.views,p.likes,u.nickname,c.name,

(select count(id) from comments where post_id=p.id ) as commentsCount

from posts p

left join categories c on c.id=p.category_id

left join users u on u.id=p.user_id

where p.category_id={$categoryId}

limit 10";

// 执行sql 返回的是结果集

$postResult=mysqli_query($connect,$sql);

// 转化成二维数组

$postArr=[];

while($row=mysqli_fetch_assoc($postResult)){

$postArr[]=$row;

}

// print_r($postArr);

?>

阿里百秀-发现生活，发现美!

• 奇趣事
• 潮科技
• 会生活
• 美奇迹

<?php echo $postArr[0]['name'] ?>

<?php echo $value['title'] ?>

<?php echo $value['nickname'] ?> 发表于 <?php echo $value['created'] ?>

阅读(<?php echo $value['views'] ?>)

评论(<?php echo $value['commentsCount'] ?>)

赞(<?php echo $value['likes'] ?>)

分类：<?php echo $value['name'] ?>

加载更多

© 2016 XIU主题演示 本站主题由 themebetter 提供

$(function(){

var currentPage=1;//第几次

var id=location.search.split('=')[1];//当前分类id

// 加载更多绑定点击事件

$('.loadmore .btn').on('click',function(){

// 点击加载更多 请求第二次的十条数据 再点第三次。。。

// 发送ajax 拿到数据 渲染到页面上

currentPage++;

$.ajax({

type:"post",

url:"api/_getMorePost.php",

data:{

categoryId:id,

currentPage:currentPage,

pageSize:10

},

success:function(res){

console.log(res);

// {code: 1, msg: "操作成功", data: Array(10)}

if(res.code==1){//一定成功了

// 循环数组 渲染页面

var data=res.data;//数组

$.each(data,function(index,val){

// console.log(val) index是索引 val 是数组里面的每一项 他一篇文章

var str=`

${val.title}

${val.nickname} 发表于 ${val.created}

${val.content}

阅读(${val.views})

评论(${val.commentsCount})

赞(${val.likes})

分类：${val.name}

`;

var entry=$(str);//把符合标签的字符串转化成jq对象

// console.log(entry)

entry.insertBefore('.loadmore');//把这篇文章追加到 loadmore之前

})

// 判断是否已经是点击的最后了

// 计算总共的次数

var maxPage=Math.ceil(res.pageCount/10);

if(maxPage==currentPage){//已经点击到最大了

// 如果是隐藏加载更多

$('.loadmore').hide();

alert('客官，已经木有更多数据了。。。')

}

}

}

})

})

})

一键复制

编辑

Web IDE

原始数据

按行查看

历史