thinkphp ajax分页加载更多最简单的实现方法
<div class="li_list"> <volist name="list" id="vo">
<div class="line-wrapper">列表内容:{$vo.name}</div>
</volist>
</div>
<div class="page" style="display: none;" id="page">{$page}</div>
<script type="text/javascript" src="__PUBLIC__/js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="__STATIC__/mobile/js/jquery-ias.min.js"></script>
调用方法
var ias = $.ias({
container: ".li_list",
item: ".line-wrapper",
pagination: "#pagination",
next: "#example1_next a"
});
ias.extension(new IASTriggerExtension({offset: 2}));
ias.extension(new IASSpinnerExtension());
ias.extension(new IASNoneLeftExtension({html: '<div style="text-align:center;height:60px;"><p><em>己经加载完了</em></p></div>'}));
完整
<div class="li_list"> <volist name="list" id="vo">
<div class="line-wrapper">列表内容:{$vo.name}</div>
</volist>
</div>
<div class="page" style="display: none;" id="page">{$page}</div> <script type="text/javascript">
var ias = $.ias({
container: ".li_list",
item: ".line-wrapper",
pagination: "#pagination",
next: "#example1_next a"
});
ias.extension(new IASTriggerExtension({offset: 2}));
ias.extension(new IASSpinnerExtension());
ias.extension(new IASNoneLeftExtension({html: '<div style="text-align:center;height:60px;"><p><em>己经加载完了</em></p></div>'}));
</script>
thinkphp ajax分页加载更多最简单的实现方法的更多相关文章
- jquery weui ajax滚动加载更多
手机端使用jquery weui制作ajax滚动加载更多. 演示地址:http://wx.cnkfk.com/nuol/static/fpage.html 代码: <!DOCTYPE html& ...
- listview下拉刷新 上拉(滑动分页)加载更多
最 近做的类似于微博的项目中,有个Android功能要使用到listview的向下拉刷新来刷新最新消息,向上拉刷新(滑动分页)来加载更多.新浪微博就是使用这种方式的典型.当用户从网络上读取微博的时候, ...
- 13 Flutter仿京东商城项目 商品列表筛选以及上拉分页加载更多
ProductList.dart import 'package:flutter/material.dart'; import '../services/ScreenAdaper.dart'; imp ...
- 12 Flutter仿京东商城项目 商品列表页面请求数据、封装Loading Widget、上拉分页加载更多
ProductList.dart import 'package:flutter/material.dart'; import '../services/ScreenAdaper.dart'; imp ...
- 微信小程序实现滚动分页加载更多
参考网址:https://www.cnblogs.com/Smiled/p/8203306.html 1.wxml: <view class='myScroll' style='float:le ...
- Ionic4.x ion-infinite-scroll 上拉分页加载更多
<ion-header> <ion-toolbar> <ion-title> Tab One </ion-title> </ion-toolbar ...
- js实现『加载更多』功能实例
DEMO : 滚动加载示例 关于如何实现『加载更多』功能,网上有插件可用,例如比较著名的使用iscroll.js实现的上拉加载更多.下拉刷新功能. 但实际用起来却是很麻烦.由于是第三方插件,要按照对方 ...
- LIstView 滚动 异步 加载更多 mono for android ScrollStateChanged ScrollState.Idle; Fling;TouchScroll
今天项目需要实现一下列表的分页加载 找到了Listview的ScrollStateChanged方法. 和大家分享一下 //先找到Listview ListView order = FindViewB ...
- 帝国cms 加载更多的实现(父栏目以及子栏目都可以实现)
1. <div class="pagelist"> <span id="loadmore" class="btn" sty ...
随机推荐
- hibernate enum映射详解
hibernate enum映射详解 在这里介绍注解的形式,如果想要了解XML配置的方式,可以自行查找相关资料. 例如以下Entity @Entity @Table(name = "t_us ...
- brave-zipkin的日志源码分析
其实在zipkin的日志里面作为发送端日志两个,sr,ss,这个日志是servlet产生的:接收端日志是四个,分别是cr,sr,ss,cs:cr和cs分别是上游的日志的信息:ss和sr是接收端输出的日 ...
- How to Install MySQL on CentOS 7
CentOS 7的yum源中貌似没有正常安装mysql时的mysql-sever文件,需要去官网上下载 # wget http://dev.mysql.com/get/mysql-communit ...
- LCD RGB 控制技术讲解 — 时钟篇(上)
时序图 下面是LCD RGB 控制的典型时序图 天啊,一下就上这玩意,怎么看??? 其实要解释上面的时序图,我们还需要了解一些LCD的显示过程.所以现在只是有个印象,稍后我们详细讲解. LCD显示流 ...
- 手淘flexible.js框架使用和源代码讲解
手淘框架是一个用来适配移动端的js框架,下面我们来讲解一下如何使用手淘的这套框架. 其实手淘框架的核心原理就是根据不同的width给网页中html跟节点设置不同的font-size,然后所有的距离大小 ...
- Python格式化输出%s和%d
python print格式化输出. 1. 打印字符串 print ("His name is %s"%("Aviad")) 效果: 2.打印整数 print ...
- 十、jdk工具之Jdb命令(The Java Debugger)
目录 一.jdk工具之jps(JVM Process Status Tools)命令使用 二.jdk命令之javah命令(C Header and Stub File Generator) 三.jdk ...
- 视频描述(Video Captioning)调研
Video Analysis 相关领域介绍之Video Captioning(视频to文字描述)http://blog.csdn.net/wzmsltw/article/details/7119238 ...
- html 1.0 鼠标放上去会亮 onmouseover onmouseout 以及this标签的使用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 使用opencv3+python实现视频运动目标检测
本文主要实现了伯乐在线上的一个实践小项目,原文链接,用以巩固opencv视频操作知识内容.整个项目均有代码注释,通俗易懂,短短几十行就可以达到还算不错的实现效果,做起来成就感满满哒.打开编辑器,一起来 ...