当前位置: 首页 > 编程笔记 >

jQuery实现下拉加载功能实例代码

曾洲
2023-03-14
本文向大家介绍jQuery实现下拉加载功能实例代码,包括了jQuery实现下拉加载功能实例代码的使用技巧和注意事项,需要的朋友参考一下

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<script>
var str = '';
if(page=="") page=1; 
var stop=true;//触发开关,防止多次调用事件 
$(window).scroll( function(event){
//当内容滚动到底部时加载新的内容 100当距离最底部100个像素时开始加载. 
if ($(this).scrollTop() + $(window).height() + 10 >= $(document).height() && $(this).scrollTop() > 10) {
//if(stop==true){ 
//stop=false; 
//var canshu="page/"+page+"; 
var url = "";
var parm = {'page':page};
page=page+1;//当前要加载的页码 
//加载提示信息 
$("#showlists").append("<li class='ajaxtips'><div style='font-size:2em'>Loding…..</div><>");
$.post(url,parm,function(data){
if( data.count == 0 ) {
$('.prolist-abtn').html('已全部加载完');
return;
} 
$.each(eval(data), function(data, val) {
var url1 = "";
$(".ajaxtips").hide();
str = '<div class="content" id="showdiv">';
str +='<div class="cont clearfix">';
str +='<a href="url"><div class="cont_img fl">';
str +='<img src='+val.imgurl+' alt="" /></div>";
str += '<div class="cont_list fl"><p>'+val.sceneryname+'</p><ul class="cont_list fl">';
str += '<li class="cont_list2"><span>¥</span>';
str +='<strong>'+val.sellerprice+'</strong>起<i>¥'+val.sellerprice+'</i></li>';
str +='</ul></div></a></div></div>';
$("#showdiv").append(str);//把新的内容加载到内容的后面 
}); 
stop=true; 
},'JSON') 
} 
});
</script> 

以上代码是小编给大家分享的jQuery实现下拉加载功能实例代码,希望对大家有所帮助!

 类似资料:
  • 本文向大家介绍jQuery实现下拉框选择图片功能实例,包括了jQuery实现下拉框选择图片功能实例的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery实现下拉框选择图片功能。分享给大家供大家参考。具体如下: 让下拉框中显示图片,并可选择对应图片,让select下拉框不仅可显示文字,还可以显示图片内容。为了更生动些,这里还加入了jQuery动画效果,当展开Select列表的时候,图片

  • 本文向大家介绍jQuery实现下拉菜单的实例代码,包括了jQuery实现下拉菜单的实例代码的使用技巧和注意事项,需要的朋友参考一下 基本效果是这样的~~ 以上所述是小编给大家介绍的jQuery实现下拉菜单的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对呐喊教程网站的支持!

  • 本文向大家介绍JavaScript下拉菜单功能实例代码,包括了JavaScript下拉菜单功能实例代码的使用技巧和注意事项,需要的朋友参考一下 本文给大家分享一段实例代码关于js实现下拉菜单功能,具体代码如下所示: 1、要阻止事件冒泡 2、键盘事件,用index索引 3、通过设置类名或清空类名的方式给元素增加动画和恢复原有样式 以上所述是小编给大家介绍的JavaScript下拉菜单功能实例代码,希

  • 本文向大家介绍c# 实现文件上传下载功能的实例代码,包括了c# 实现文件上传下载功能的实例代码的使用技巧和注意事项,需要的朋友参考一下 NuGet 安装SqlSugar 1.Model文件下新建 DbContext 类 2.建uploading实体类 3.Manager文件下建UploadingManager 窗体加载Form1_Load 1.读取到数据库字段name并赋值 2.comboBox事

  • 本文向大家介绍jQuery实现的无限级下拉菜单功能示例,包括了jQuery实现的无限级下拉菜单功能示例的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery实现的无限级下拉菜单功能。分享给大家供大家参考,具体如下: 运行效果图如下: 更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery切换特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常用插件及用法总

  • 本文向大家介绍jQuery模拟select实现下拉菜单功能,包括了jQuery模拟select实现下拉菜单功能的使用技巧和注意事项,需要的朋友参考一下 用jquery模拟一淘上面的搜索下拉的功能,利用css3做箭头的动画效果。 JS代码: demo:(只有在高级的chrome及firefox下才能看到CSS3动画效果) 截个图: 代码: 以上就是本文的全部内容,希望能给大家一个参考,也希望大家多多