`

页面做分页

    博客分类:
  • JS
 
阅读更多
/**
 * 跳转
 * 
 * @param 跳转的页号
 */
function jumpPage(pageNo) {
	$("#pageNo").val(pageNo);
	$("#listForm").submit();
}

  //输入页码然后跳转
    function goPage(){
    	if($("#goPageNo").val()>=1){
    		if($("#goPageNo").val()<=$("#totalPage").val()){
    			jumpPage($("#goPageNo").val());
    		}else{
        		jumpPage($("#totalPage").val());
        	}
    	}else{
    		jumpPage(1);
    	}
    }

//隐藏参数
  <input type="hidden" name="pageNo" id="pageNo" value="${pageData.pagination.pageNo}" />
 <input type="hidden" name="fieldName" id="fieldName" value="${pageData.compositor.fieldName}" />
<input type="hidden" name="compositorType" id="compositorType" value="${pageData.compositor.compositorType}" />
 <input type="hidden" name="totalPage" id="totalPage" value="${pageData.pagination.totalPage}" />

//具体分页
<div class="pagination"> 
      <a href="javascript:jumpPage(1)" title="First Page">« 首页</a>
      <c:if test="${pageData.pagination.hasPrevPage}">  <a href="javascript:jumpPage(${pageData.pagination.prevPage})">« 上一页</a> </c:if>
      <c:if test="${pageData.pagination.pageNo<=pageData.pagination.totalPage}">
      <a href="javascript:jumpPage(${pageData.pagination.pageNo})" class="number current" title="${pageData.pagination.pageNo}">${pageData.pagination.pageNo}</a>
      </c:if>
      <c:if test="${pageData.pagination.pageNo+1<=pageData.pagination.totalPage}">
       <a href="javascript:jumpPage(${pageData.pagination.pageNo+1})" class="number" title="${pageData.pagination.pageNo+1}">${pageData.pagination.pageNo+1}</a> 
      </c:if>
      <c:if test="${pageData.pagination.pageNo+2<=pageData.pagination.totalPage}">
       <a href="javascript:jumpPage(${pageData.pagination.pageNo+2})" class="number" title="${pageData.pagination.pageNo+2}">${pageData.pagination.pageNo+2}</a> 
     </c:if>
     <c:if test="${pageData.pagination.pageNo+3<=pageData.pagination.totalPage}">
      <a href="javascript:jumpPage(${pageData.pagination.pageNo+3})" class="number" title="${pageData.pagination.pageNo+3}">${pageData.pagination.pageNo+3}</a> 
     </c:if>
      <c:if test="${pageData.pagination.hasNextPage}"><a href="javascript:jumpPage(${pageData.pagination.nextPage})" title="Next Page">下一页 »</a> </c:if>
       <a href="javascript:jumpPage(${pageData.pagination.totalPage})"> 尾页»</a> 总记录数 <i class="color_red">${pageData.pagination.totalCount}</i> 条
        <input type="text" id="goPageNo" name="goPageNo" value="" class="page">
        /${pageData.pagination.totalPage}
        <input type="reset" value="GO" onclick="javascript:goPage();" class="btn btn_gray go">
      </div>
    </div>
  </div>

分享到:
评论

相关推荐

    生成静态页面并分页asp.net点击按钮把所有动态页面生成静态页面

    asp.net生成静态页面并分页 点击按钮把所有动态页面生成静态页面 asp.net生成静态页面并分页 asp.net生成静态页面并分页 asp.net生成静态页面并分页 asp.net生成静态页面并分页 asp.net生成静态页面并分页

    jsp页面数据分页通用组件

    **JSP页面数据分页通用组件详解** 在Web开发中,数据分页是常见的功能,尤其是在处理大量数据时,为了提高用户体验和加载速度,通常会将数据分成多个页进行显示。`jsp页面数据分页通用组件`就是这样一个工具,它为...

    Jquery页面分页

    **jQuery页面分页详解** 页面分页是网页开发中常用的一种技术,特别是在处理大量数据时,为了提高用户体验,避免一次性加载过多内容导致页面卡顿。jQuery作为一种轻量级的JavaScript库,提供了简单易用的API,使得...

    jq静态页面实现分页

    在网页开发中,分页是一种...通过阅读和理解代码,你可以更好地掌握使用jQuery实现静态页面分页的方法。记得在实际应用中,要根据项目需求进行适当调整,如增加每页条目数的选择功能,或者添加分页状态的持久化保存。

    jsp页面分页代码

    在Java服务器页面(JSP)开发中,分页是一种常见的需求,特别是在处理大量数据时,如用户列表、商品展示或论坛帖子。它提高了用户体验,使用户可以逐步浏览内容,而不是一次性加载所有信息,从而减轻服务器压力,...

    生成静态页面并分页生成静态页面并分页

    在IT行业中,生成静态页面和实现分页是网站优化与性能提升的重要技术手段。静态页面主要指的是HTML文件,它们在服务器端生成后直接发送给客户端,无需每次请求时都执行服务器端的脚本,从而降低了服务器负担,提升了...

    jstl实现jsp页面的分页

    本文将详细介绍如何使用JavaServer Pages Standard Tag Library(JSTL)来实现JSP页面的分页。 首先,JSTL是JSP开发中的一个核心库,它提供了一系列预定义的标签,简化了JSP页面中的Java代码,使得页面更加清晰易读...

    页面无刷新分页

    在网页设计中,"页面无刷新分页"是一种常见的用户体验优化技术,它允许用户浏览大量数据时无需每次点击新链接或按钮就加载新的内容。这种技术主要依赖于JavaScript,配合AJAX(异步JavaScript和XML)来实现。下面将...

    页面 分页 table

    "页面分页table"这个标题暗示了我们讨论的是如何在HTML或Web应用程序中使用表格(table)来展示大量数据,并通过分页功能来有效地管理这些数据的显示。 首先,表格(Table)是HTML中的一个重要元素,用于组织和呈现...

    js 静态页 html页面 分页

    实现html静态页面分页,ul li的分页功能,实现首页,尾页,共几页,共几条,123的详细分页 的功能

    数据库显示页面上分页

    数据库显示页面上分页,数据库显示页面上分页,数据库显示页面上分页

    自定义页面分页标签自定义页面分页标签

    自定义页面分页标签是指开发者根据项目需求,创建个性化的分页组件,以实现更加灵活、符合界面设计风格的分页功能。下面将详细探讨如何实现自定义页面分页标签及其相关的知识点。 1. **基础概念**: - 分页:将...

    page分页jsp页面以及后台代码

    在网页开发中,分页是一种常见的数据展示方式,特别是在数据量较大的情况下,为了提高用户体验,避免一次性加载所有数据导致页面加载缓慢或者用户滚动困难。"page分页jsp页面以及后台代码"这个主题涵盖的是如何在...

    Asp.NET生成静态页面并分页

    而分页则是在大量数据展示时,为了提高用户浏览效率和页面加载速度而采用的技术。下面我们将详细探讨如何在Asp.NET中实现这两项功能。 首先,我们来看如何生成静态页面。Asp.NET提供了多种方法来生成静态HTML。一种...

    单纯的jsp页面动态分页

    "单纯的jsp页面动态分页"是指通过JavaServer Pages (JSP)技术来实现页面内容的动态分页显示,主要涉及到后端数据处理、前端交互以及数据库查询优化等关键点。下面将详细阐述这一知识点。 1. **JSP技术基础**: JSP...

    asp 页面数据分页

    标题“asp 页面数据分页”指的是在ASP环境中实现网页数据展示的分页功能。通常,这会涉及到以下几个关键知识点: 1. **数据库连接**:在ASP中,我们需要使用ADO(ActiveX Data Objects)来连接和操作数据库,如...

    jpager分页标签(用于jsp页面中数据分页)

    总结,`jpager` 是一个实用的 JSP 分页解决方案,它简化了页面分页的实现,提供了丰富的自定义选项,并能与多种Web开发框架无缝集成。通过熟练掌握 `jpager`,可以提升 JSP 页面的数据展示效率和用户体验。

    ASP.NET生成静态页面和分页

    现在,让我们深入探讨ASP.NET如何实现静态页面生成和分页功能。 **一、ASP.NET生成静态页面** 1. **预编译**:ASP.NET 提供了预编译功能,可以将ASPX页面转换为编译后的DLL文件,减少运行时的解析时间。这虽然不是...

    Ajax不刷新页面完成分页

    下面将详细阐述这一技术及其在JSP页面分页中的应用。 1. Ajax基础 Ajax的核心是XMLHttpRequest对象,它是JavaScript内置的对象,用于在后台与服务器通信。通过创建XMLHttpRequest对象,我们可以发送HTTP请求到...

    velocity实现静态页面分页

    在Web开发中,静态页面的分页是一种常见的需求,它...总的来说,利用Velocity实现静态页面分页,主要涉及后端数据处理、分页模型构建、VTL模板编写和前端UI设计。通过合理规划和实施,可以创建出高效、易用的分页系统。

Global site tag (gtag.js) - Google Analytics