/**
* 取得页码数组
*
* @param showPageMaxCount 允许显示的页码最大数量
* @param pageNow 当前页码
* @param pageCount 总页数
*
* @return 页码数组(整数数组)
*/
function getPageNumArr(showPageMaxCount, pageNow, pageCount){
var pageNumArr = [];
var pageNumBegin, pageNumEnd;
if(pageCount<=showPageMaxCount){
// 总页数在10以内
pageNumBegin = 1;
pageNumEnd = pageCount;
}else{
// 总页数在10以外
if(pageNow <= Math.floor(showPageMaxCount/2)){
// 当前页码在头几页以内
pageNumBegin = 1;
pageNumEnd = showPageMaxCount;
}else if((pageCount-pageNow) <= Math.floor(showPageMaxCount/2)){
// 当前页码在最后几页以内
pageNumBegin = pageCount-showPageMaxCount;
pageNumEnd = pageCount;
(pageNumEnd-pageNumBegin)>=showPageMaxCount && (pageNumBegin++)
}else{
// 当前页码前不着村后不着甸
pageNumBegin = Math.ceil(pageNow-showPageMaxCount/2);
pageNumEnd = Math.floor(pageNow+showPageMaxCount/2);
(pageNumEnd-pageNumBegin)>=showPageMaxCount && (pageNumBegin++)
}
}
for(var i=pageNumBegin;i<=pageNumEnd;i++){
pageNumArr.push(i);
}
return pageNumArr;
}
// 测试代码 开始
// 测试偶数
var strArr = [];
for(var i=1;i<=30;i++){
var arr = getPageNumArr(6, i, 30);
strArr.push("第"+i+"页:\t"+arr.join("\t"));
}
alert("测试偶数:\n\n"+strArr.join("\n"))
// 测试奇数
var strArr = [];
for(var i=1;i<=30;i++){
var arr = getPageNumArr(5, i, 30);
strArr.push("第"+i+"页:\t"+arr.join("\t"));
}
alert("测试奇数:\n\n"+strArr.join("\n"))
// 测试代码 结束
分享到:
相关推荐
首先,文档中提到了一个分页函数`paging`,该函数接受一个参数`$pageType`来决定是生成数字分页还是文本分页。数字分页通过生成一系列的页码链接来实现,用户可以通过点击不同的页码直接跳转到相应页面。文本分页...
使用`addEventListener()`方法可以添加事件监听器,例如`'click'`事件,当用户点击翻页按钮时,执行相应的处理函数。 4. **数据加载策略** 分页通常涉及到从服务器获取数据。可以使用Ajax(Asynchronous ...
类还包含了生成翻页链接的功能,包括“上一页”、“下一页”、第一页和最后一页的链接。这些链接通过JavaScript的`location.href`改变页面地址,同时携带必要的查询参数(如当前页码、查询SQL等)。 6. **实际应用...
在网页开发中,分页是常见的一种数据展示方式,尤其在处理大量数据时,它可以提高用户体验,使得页面加载更快,用户更容易浏览。本教程将详细讲解一个原生JavaScript实现的分页插件,该插件不依赖任何JavaScript库,...
`updatePagination`函数则根据新的数据更新分页导航的状态,例如当前选中的页码。 以上就是使用jQuery获取JSON数据并实现分页功能的基本步骤。在实际项目中,你可能还需要考虑错误处理、数据缓存、动态加载效果等...
在上述代码中,`data`代表要分页的数据数组,`itemsPerPage`是每页显示的数据项数量。`updatePageButtons`函数负责生成并更新页码按钮,同时添加点击事件监听器。`prev`和`next`按钮则分别处理翻至上一页和下一页的...
总结来说,该段代码通过定义一个分页函数来处理分页逻辑,通过一系列算法计算需要显示的页码,并且构建了具有前后翻页功能的分页导航条。通过简洁的代码实现了一个美观实用的分页效果,对于Web开发者来说,是实现...
通常我们需要创建一个容器元素,然后根据分页结果动态生成和插入页码元素。 4. **事件监听**:为了让用户能够翻页,我们需要监听用户的点击事件。JS的`addEventListener`方法可以为指定元素添加事件监听器,当用户...
2. 表格渲染:使用Vue.js的`v-for`指令,可以方便地根据数据数组生成表格行。同时,表格的列可以通过`v-bind`或`:`指令绑定数据属性来实现动态渲染。 3. 分页逻辑:组件需要提供方法来切换页码,这通常包括上一页、...
本知识点主要聚焦于使用JavaScript实现表格的分页功能,包括点击按钮跳转和输入页数直接跳转两种交互方式。 1. **表格分页原理** 表格分页的基本思想是将大量数据分成多个部分,每次只加载一部分(即一页)到页面...
2. **监听分页事件**:使用Jquery的`click`事件监听分页链接或按钮,触发Ajax请求。 3. **更新数据**:Ajax请求成功后,更新数据显示区的内容。 4. **样式美化**:使用CSS或第三方库(如Bootstrap)美化分页样式,...
3. **事件监听**:为了响应用户的翻页操作,需要设置事件监听器,如`addEventListener`,监听点击事件,当用户点击分页按钮时触发相应的分页函数。 4. **逻辑控制**:分页涉及到当前页码的计算和验证,以及如何根据...
最后,根据当前页码输出相应的内容,并生成翻页链接。 需要注意的是,这个函数假设每页的字数是固定的,如果实际应用中文章长度差异较大,可能需要调整`$PageLength`的值以适应不同长度的文章。此外,翻页链接是...
1. **ASP基础**:学习者需要了解ASP的基本结构,如`<% %>`代码块用于插入脚本,以及如何声明和使用变量、常量、数组等基本数据类型。 2. **VBScript或JScript**:ASP支持这两种脚本语言,VBScript更常见,它类似于...
在本文中,我们将深入探讨如何使用Vue.js框架来实现一个基本的分页查询功能,这在数据量较大的应用中非常常见。Vue.js是一个轻量级的JavaScript库,它提供了响应式的数据绑定和组件化功能,使得开发用户界面更加便捷...
在实际使用时,可以通过遍历这个数组,输出每个页码的HTML链接形式,使得用户可以点击这些页码进行翻页操作。 为了实现分页功能,开发者需要将SubPages类的实例化和相关方法的调用嵌入到PHP代码中,比如在一个数据...
使用`bind`方法将`this`上下文和新的页码参数绑定到`onPagination`回调函数上,确保在点击分页按钮时,函数能正确执行。 总的来说,这个React.js翻页插件实例是一个基础但实用的组件,它可以处理分页逻辑并提供...
6. **分页导航**:在页面底部生成了分页链接,允许用户切换到不同的页码。通过调整`start`参数的值,实现前后翻页和跳转至指定页的功能。分页链接的生成考虑到了页码边界条件,例如,当到达最后一页时,不再显示...
- 使用字符串拼接的方式生成图片的路径并显示图片。 #### 导航链接更新函数 `showlink()` ```javascript function showlink() { guide.innerHTML = ""; guide.innerHTML += "<font color='red'><b>" + maxCh + ...
在本文中,我们将详细介绍使用Vue2.0实现数据分页功能以及实现页码跳转效果的方法。分页功能是前端开发中常见的需求之一,特别是在处理大量数据展示时,合理的分页不仅可以优化用户的阅读体验,还可以减少服务器的...