Integer pageSize = json.get("pageSize")==null?0:Integer.valueOf(StringUtil.trim(json.get("pageSize")));//每页的个数
Integer pageNum = json.get("pageNum")==null?0:Integer.valueOf(StringUtil.trim(json.get("pageNum")));//第几页
JSONArray ja = JSONArray.fromObject(listData);
List<Map<Object, Object>> csImages = new ArrayList<Map<Object, Object>>(ja.size());
Integer totalCount = ja.size();//总条数
Integer totalPage = 0;
if(pageSize!=0&&pageNum!=0){
totalPage = totalCount%pageSize==0?totalCount/pageSize:totalCount/pageSize+1;//总页数
//做物理分页
int start = (pageNum-1)*pageSize;
int end = pageSize*pageNum;
for(int i=start;i<end;i++){
if(i<totalCount){
Map<Object, Object> maptemp = (Map<Object, Object>)ja.get(i);
Map<Object, Object> tempt = new HashMap<Object, Object>();
//Map<Object, Object> config1 = dataCoreManager.initSystemCofCache(CHANNEL_ID);
//String domain = StringUtil.trim(config1.get(CmsContants.FAST_DFS_IMAGE_URL));
//tempt.put("imgUrl", domain+maptemp.get("imgSrc"));
tempt.put("imgUrl",maptemp.get("imgSrc"));
tempt.put("skipUrl", maptemp.get("imgUrl"));
tempt.put("name", maptemp.get("imgTitle"));
csImages.add(tempt);
}else{
break;
}
}
}
//csImages即为结果
<script type="text/javascript">
var page = 2;
var allPage = ${result.pageAllSize!0};
var tag_id = "${tag_id!''}";
var searchWord = "${searchWord!''}";
function getMore(){
var url = '${ctx}/wxapp/search_detail_list.html';
url += "?pageNum=" + page + "&tag_id=" + tag_id + "&searchWord=" + searchWord + "&t=" + (+new Date().getTime());
getList(url);
try{
myScroll.refresh();
}catch(e){}
}
function getList(url){
$.ajax({
url:url,
dataType:"html",
async: false,
success:function(html){
if(html.indexOf("-- no more imformation --") > 1){
}else{
$("#thelist").append(html);
page = page + 1;
document.cookie = 'search_detail_page='+page;
}
if((page-1)==${result.pageAllSize!'0'}){
$("#pullUp").removeClass("loading").find(".pullUpLabel").html("加载完毕");
}else{
$("#pullUp").removeClass("loading").find(".pullUpLabel").html("下滑加载更多");
}
},
error:function(){
alert("糟糕,出错了:(");
$("#pullUp").removeClass("loading").find(".pullUpLabel").html("下滑加载更多");
}
});
}
//下滑的相关方法=====================
function getScrollTop() {
var scrollTop = 0;
if (document.documentElement && document.documentElement.scrollTop) {
scrollTop = document.documentElement.scrollTop;
}
else if (document.body) {
scrollTop = document.body.scrollTop;
}
return scrollTop;
}
//获取当前可是范围的高度
function getClientHeight() {
var clientHeight = 0;
if (document.body.clientHeight && document.documentElement.clientHeight) {
clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight);
}
else {
clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
}
return clientHeight;
}
function getScrollHeight() {
return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
}
//下滑的相关方法=====================
//js的最下面协商
window.onscroll = function () {
if (getScrollTop() + getClientHeight() == getScrollHeight()) {
alert("记载到底部");
$(this).addClass("loading").find(".pullUpLabel").html("加载中");
getMore();
}
}
</script>
分享到:
相关推荐
在这个"android listView 模拟物理分页Demo 按键"项目中,开发者通过按键实现了分页加载数据的功能,以便用户逐步查看大量内容,避免一次性加载所有数据导致的性能问题。这个Demo适合初学者学习如何在ListView中实现...
假分页不同于传统的物理分页,它不预先计算和生成所有页面,而是根据用户的滚动行为动态加载更多数据。本教程将围绕Struts2和Hibernate框架,讲解如何实现页面列表的假分页。 **一、Struts2框架简介** Struts2是一...
2. **监听滚动事件**:通过监听scrollEnd事件,判断是否达到分页加载条件,如到达页面底部。 3. **动态插入内容**:加载新数据后,应动态插入到页面相应位置,而非替换现有内容。 4. **性能优化**:合理设置分页大小...
3. 事件监听:监听滚动事件,当滚动到底部时,触发加载更多图片的函数。 4. 动画效果:为鼠标悬停事件添加动画效果,如淡入淡出遮罩层,平滑地显示或隐藏详细信息。 5. 数据接口:与后端服务器通信,获取并处理新的...
- **物理分页**:一次性加载所有数据,然后在客户端进行分页,适用于数据量小的情况。 - **逻辑分页**:每次请求只从服务器获取当前页的数据,适用于大数据量,可以有效减少网络传输和内存占用。 为了优化用户体验...
2. 物理分页:将数据预先分割成固定大小的页存储,每次请求时直接读取指定页的数据,适用于数据量极大且频繁访问的情况。 3. 记录数分页:先查询总记录数,然后计算出总页数,再根据页码获取数据,适用于数据量较小...
这通常涉及到分页加载,即每次加载一部分新数据,以减少一次性加载大量数据对性能的影响。 3. **橡皮筋效果(弹性回弹,OverScroll)**: 橡皮筋效果源自iOS,当用户尝试超出列表边界时,列表会像橡皮筋一样回弹,...
这通常用于分页加载,每次加载一定数量的数据,直到所有数据加载完毕。 2. 实现方式:可以通过监听ListView的OnScrollListener,当用户滚动到底部时,调用加载更多数据的接口。需要注意的是,要防止在数据加载过程...
1. **数据连接**:使用JDBC(Java Database Connectivity)驱动程序建立与数据库的连接,通过`Class.forName()`加载驱动,然后使用`DriverManager.getConnection()`获取连接。 2. **预处理SQL语句**:编写一个带有...
这种功能适用于分页加载大量数据的情况。实现方式通常是监听ListView的滚动事件,当用户滚动到底部时触发加载更多数据的逻辑。开发者需要维护一个状态变量,以判断何时需要加载新数据,同时确保加载新数据后更新...
这份指南基于尊重用户知情权和操作权的原则,旨在减少用户在使用小程序时受到的干扰,提高操作效率。 在设计小程序时,首要任务是确保每个页面都有明确的重点,以便用户能够迅速理解页面内容。设计师应当避免添加与...
- 上拉加载更多是在列表底部,用户滚动到最后一项时,可以触发加载更多数据的操作,通常用于分页加载内容。这在无限滚动列表或者内容不断更新的应用中非常实用。 - 实现上拉加载更多的方法是检测ListView的滚动...
6. **标签分页导航**:可以设置顶部或底部的标签分页栏,最多不超过5个,通常不超过4个,以确保足够的点击区域。首页可使用微信提供的原生底部标签样式。 7. **加载和等待反馈**:为了减少用户等待的不适,应及时...
在前端展示时,可以考虑延迟加载,即只加载当前页面的数据,当用户滚动到底部时再加载下一页。这样可以减少一次性加载大量数据的压力。 总结起来,大数据量翻页查询的优化涉及到数据库设计、索引策略、查询优化、...
当用户滚动到页面底部时,通过 AJAX 加载更多内容,并调用 `masonry('appended', newContent)` 将新内容添加到现有瀑布流中,Masonry 会自动调整布局。 7. **图片懒加载**:为了优化性能,可以使用懒加载技术(lazy...
这个功能可以分页加载数据,避免一次性加载过多数据导致性能问题。通常需要监听ListView的滚动事件,当滚动到底部时,调用加载更多数据的方法。 4. **阻尼效果**:阻尼效果是指在用户滑动时,ListView的滚动速度会...
3. **上拉加载更多(Load-more)**: 当用户滚动到ListView底部时,可以触发加载更多数据的操作,用于分页加载内容。 4. **阻尼效果(Damping Effect)**: 提供了更加自然的滑动反馈,使得用户在滑动ListView时感受到一种...
通过jQuery的AJAX功能,可以实现分页加载,当用户滚动到底部时,自动加载更多的图片。 为了使图片展示更具吸引力,你还可以考虑添加一些高级功能,如图片缩略图导航、滑动过渡效果、幻灯片播放等。这些都可以通过...
7. **无限滚动**:为了提供无尽的卡片浏览体验,可以利用`RecycleView`的特性,结合数据加载策略,如分页加载。当用户滑动到列表底部时,自动加载更多数据。 8. **状态管理**:考虑到网络延迟或错误,需要处理卡片...