Jquery实现滚动到底部加载更多(最原始)
Posted Jim
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Jquery实现滚动到底部加载更多(最原始)相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8" /> <title>滚动条到底部时自己加载新的内容</title> <script type=‘text/javascript‘ src=‘js/jquery.js‘></script> <script type="text/javascript"> var page_num=2; $(document).ready(function(){ $(window).scroll(function(){ if($(document).scrollTop()>=$(document).height()-$(window).height()){ var div1tem = $(‘#container‘).height() var str =‘‘ $.ajax({ type:"GET", url:‘ajaxdata‘, dataType:‘json‘, beforeSend:function(){ $(‘.ajax_loading‘).show() //显示加载时候的提示 }, success:function(ret){ $(".after_div").before(ret) //将ajxa请求的数据追加到内容里面 $(‘.ajax_loading‘).hide() //请求成功,隐藏加载提示 } }) } }) }) </script> {/literal} </head> <body> <div> <div style=‘width:100%;height:1200px‘>文章内容</div> <div class=‘after_div‘></div> <div class=‘ajax_loading‘ style=‘background:#F0F0F0;height:60px;width:100%;text-align:center;line-height:60px;font-size:18px;display:none;position:fixed;bottom:0px‘><img src="img/loadinfo.net.gif"> 数据加载中</div> </div> </body> </html>
参考:http://www.oschina.net/code/snippet_1042544_20893
以上是关于Jquery实现滚动到底部加载更多(最原始)的主要内容,如果未能解决你的问题,请参考以下文章