jQuery上拉刷新下拉加载效果
jQuery 的上拉刷新下拉加载，挺适合移动端项目用的，体验上也比较接近原生 App。你只需要监听一下滚动事件，比如用$(window).scroll()，判断用户滑到底部还是顶部，触发对应的数据加载逻辑。加点动画，比如个加载圈，响应也快，用户感知也好。
jQuery 的事件机制还挺灵活，像监听滚动、控制 DOM 渲染这些事，它做起来都蛮轻松。你可以把数据求封装在一个函数里，触发条件到了就自动拉数据。懒加载场景挺常见，比如新闻列表、评论区、商品展示页之类的。
布局上，你就用个 加载动画也别忽略了，像 代码结构方面，我建议分清逻辑层和 UI 层。逻辑负责监听和求，UI 只管显示，维护起来也方便。移动端的话，可以再配合下 iScroll 或 jQuery Mobile 之类的库，滚动体验会更自然。 如果你正在做一个内容列表、社交信息流、商品展示页一类的东西，这段代码就适合拿来改造。如果你想看具体实现，建议直接去看看那个的完整代码文件，例子挺清楚的，改起来也简单。容器，初始数据放进去就好。加载新内容时更新这个容器的内容就行，页面不卡，体验也流畅。AJAX配合.append()或者.html()方法，用起来顺手。
loading.gif这种小图标放一放，用户一看就知道数据正在加载，挺有必要。加个fadeIn()或slideDown()的动画，让体验更细腻。
文件大小：45.69KB
评论区