滑动门+下滑加载更多详细图解
时间：2024-02-28 16:43:25|栏目：齐博CMSX1教程|点击：43 次
~~~
var type_num = 0; //默认是第一项
$(document).ready(function () {
$(".bbs_title h3").click(function(){
$(".bbs_title h3").removeClass('ck');
$(this).addClass('ck');
type_num = $(this).index();
$(".SideInfos .show_content").hide();
$(".SideInfos .show_content").eq(type_num).show();
scroll_get = true; //避免其它加载完了,这里却无法加载
});
});
var Mpage = new Array(); //页码数组
var urldb = new Array('{qb:url name="wap_member_homepage_002" /}','{qb:url name="wap_member_homepage_reply_002" /}','{qb:url name="wap_member_homepage_reply_003" /}','{qb:url name="wap_member_homepage_reply_004" /}'); //不同的URL
function ShowMoreBBs(){
if( typeof Mpage[type_num]=='undefined' ){
Mpage[type_num] = 1;
}
Mpage[type_num]++;
var url = urldb[type_num] + Mpage[type_num];
$.get(url,function(res){
if(res.code==0){
if(res.data==''){
layer.msg("已经显示完了！",{time:500});
}else{
$(".SideInfos .show_content").eq(type_num).append(res.data);
set_i_num();
scroll_get = true;
}
}else{
layer.msg(res.msg,{time:2500});
}
});
}
//滚动显示更多
var scroll_get = true; //做个标志,不要反反复复的加载
$(document).ready(function () {
$(window).scroll(function () {
if (scroll_get==true && (400 + $(window).scrollTop())>($(document).height() - $(window).height())) {
scroll_get = false;
layer.msg('内容加截中,请稍候',{time:1000});
ShowMoreBBs();
}
});
});
//设置标题序号
function set_i_num(){
var j = 0;
$(".SideInfos .show_content").eq(type_num).find('ul span').each(function(){
j++;
$(this).html(j);
});
}
</script>
~~~
官方教程已经同步更新，其实很简单的 稍微用一点点心就可以发现规律了。 [https://www.kancloud.cn/php168/x1\_of\_qibo/842761](https://www.kancloud.cn/php168/x1_of_qibo/842761)
上一篇：使用宝塔面板php7.3的用户如果无法安装应用的解决办法
栏 目：齐博CMSX1教程
本文标题：滑动门+下滑加载更多详细图解
本文地址：https://zhanzhang.eapis.site/html/381.html
您可能感兴趣的文章
- 2026-02-09 12:03【超详细】配置云服务器与环境（腾讯云）
- 2025-10-25 19:09前端项目部署，阿里云服务器部署前端项目，超详细
- 2024-02-28 16:35微信支付授权目录详细讲解
- 2026-02-09 11:50【超详细】使用FRP、阿里云服务器实现内网穿透连接远程桌面
- 2025-10-22 17:15详细Solaris 11 安装图解教程
- 2025-10-22 15:48使用HTML5加载音频和视频的实现代码
- 2024-02-28 16:35列表页制作及无滚动加载内容
- 2025-10-22 22:49在HTML里加载摄像头的方法
- 2025-10-22 14:44在Linux和FreeBSD下如何使用U盘
- 2024-02-28 16:35异步加载标签数据
粤公网安备 13010202004186