ajax 下拉加载固定数据,js 下拉底部加载|滑轮滚动到页面底部ajax加载数据的实例...

转载链接：http://www.cnblogs.com/thinksley/archive/2013/05/12/3074237.html

滚动下拉到页面底部加载数据是很多瀑布流网站的做法，那来看看配合jsonp是如何实现的吧，小菜总结记录之用，高手勿喷。

当然本例子采用的是jquery库，后期会做成原生js。

本例的数据调用的是锋利的jquery一书提供的一段json。

首先要先判断页面怎么样才是滚动到底部，也就是scrollTop+window的height是否大于document的height，jquery如下代码: $(window).scrollTop()+$(window).height()>=$(document).height()；

再给window绑定scroll事件。所以整个页面demo可以这样做:

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉

往下拉拉到底部就是实现异步数据加载了，当然了，实际项目还要加上如果没数据了要怎么显示，怎么操作。这些加判断就行了。