JQ 上拉加载（无插件）

最新推荐文章于 2021-03-26 20:42:43 发布

wbj16116

最新推荐文章于 2021-03-26 20:42:43 发布

阅读量1.4k

点赞数

文章标签： jq 上拉加载

本文链接：https://blog.csdn.net/wbj16116/article/details/79135531

版权

html:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>晒单墙</title>
<meta name="keywords" content="关键词">
<meta name="description" content="网站描述">

<script src="./themesmobile/68ecshopcom_mobile/js/jquery.min.js"></script>
</head>
<body>
<div class="header">
<a href="javascript:history.go(-1);" class="back"><img src="images/back.png" alt=""></a>
<h1>晒单墙</h1>
<input id="num" type="hidden" name="" value="1">
<a href="release_dry.php" class="release"><img src="images/release.png" alt=""></a>
</div>
<div class="dry mt95">
<ul id="show_img">
</ul>
<div style="text-align: center;" id="msg"></div>
</div>

</body>
<script type="text/javascript">
$(function(){
var msg_list_loading = false;
function pend(){
var pag=$('#num').val();
$.post("show_orders.php",{page:pag},function(data){
var data = JSON.parse(data);
console.log(data);
if(data.length != 0){
if(data){
var array = data[0];
var str = '';
$.each(data,function(index,array){

//以下蓝色部分根据个人需要输出
str += "<li>";
str += " <h2><a href=''><img src='images/dry_head.png' alt=''>"+array['user_name']+"</a><span>"+array['add_time']+"</span></h2>"
str += " <div class='word'>";
str += " <a href='javascript:void(0);'>";
str += " <p>"+array['user_name']+"</p>";
str += " <div class='img'>";
$.each(array['img'],function(num,img){
str += " <img src='./"+array['img'][num]+"' alt=''>";
});
str += " </div>";
str += " </a>";
str += " </div>";
str += "<div class='comment'>";
$.each(array['content'],function(n,cont){
str += "<div class='box'>";
str += "<a href=''><img src='images/dry_head.png' alt=''></a>";
str += "<div>";
str += "<h3>"+cont['user_name']+"<span style='float: right;'>"+cont['add_time']+"</span></h3>";
str += "<p>"+cont['content']+"</p>";
str += "</div></div>";
});
str += "</div>";
str += "<input type='text' name='say' id='say"+array['shaidan_id']+"' required='' placeholder='来说点什么' >";
str += "<input οnclick='message("+array['shaidan_id']+")' type='' value='提交'>";
str += " <div class='edit'>";
str += " <a href='show_orders.php?act=get_msg&id="+array['shaidan_id']+"'><img src='images/comment.png' alt=''>"+array['num']+"</a>";
str += " <a οnclick='zan("+array['shaidan_id']+")' href='javascript:void(0)'>";
if(array['user_click']==1){
str += "<img id='zan"+array['shaidan_id']+"' src='images/love_1.png' alt=''>";
}else{
str += "<img id='zan"+array['shaidan_id']+"' src='images/love.png' alt=''>";
}

str += "<span id='"+array['shaidan_id']+"'>"+array['count_click']+"<span></a>";
str += " </div>";
str += "</li>";
});
$("#show_img").append(str);
}
}else{
$('#msg').html('没有更多了');
}
});
pag++;
$('#num').val(pag);
}
pend(); //页面加载完先调用一次
$(window).scroll(function () {
var bot = 1;
if ((bot + $(window).scrollTop()) >= ($(document).height() - $(window).height() -1)) {
$('#msg').html('正在加载');
if(!msg_list_loading){
msg_list_loading = true;
pend();
msg_list_loading = false;
}
}else if($(document).scrollTop() <= 0){
//("滚动条已经到达顶部为0");
}
});

--------------------------------------------------------------------------------------------------------------------------------

php:
<?php
$pager=($_POST['page']-1)*4;
$usr_id = $_SESSION['user_id'];
//下拉加载，每次刷新显示最新的4条
//每次加载显示增加6条
$sql = "select s.user_id,s.shaidan_id,s.img,s.message,s.add_time,s.count_click,s.user_click,u.user_name from " . $ecs->table('shaidan') . "s left join ".$ecs->table('users') ." u on s.user_id = u.user_id where s.status = 1 ".$where." order by add_time desc limit ".$pager.",4";
$shaidan = $db->getAll($sql);

$data=array();
foreach ($shaidan as $key => $val) {
$user_str[$key] = $val['user_click'];
$user_array[$key]= explode('-',substr($user_str[$key],1));
$is_click[$key] = array_search($usr_id,$user_array[$key]);
if($is_click[$key] || $is_click[$key]===0){
$is_click[$key]=1;
}else{
$is_click[$key]=0;
}

$data[$key] = array(
'user_id' => $val['user_id'],
'shaidan_id' => $val['shaidan_id'],
'img' => explode('-',substr($val['img'], 1)), //图片字符串转为数组
'message' => $val['message'],
'add_time' => date("Y-m-d H:i", $val['add_time']),
'count_click'=>$val['count_click'],
'user_name' =>$val['user_name'],
'user_click' =>$is_click[$key],
'num' =>$db->getOne("select count(comment_id) from " . $ecs->table('comment') . "where parent_id = ".$val['shaidan_id']),
'content' =>$db->getAll("select c.parent_id,c.user_id,c.content,c.add_time,u.user_name from " . $ecs->table('comment') . "c left join ".$ecs->table('users')." u on c.user_id = u.user_id where c.parent_id = ".$val['shaidan_id']." order by c.add_time desc limit 2" )
);
}
echo json_encode($data) ;exit;
})

</script>
</html>

wbj16116

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
JQ 上拉加载（无插件）

html:晒单墙晒单墙$(function(){var msg_list_loading = false;function pend(){var pag=$('#num').val(); $.post("show_orders.php",{page:pag},funct
复制链接

扫一扫