/**

*参数说明:

*currentPage:当前页数

*countPage:总页数

*changeMethod:执行java后台代码的js函数,即是改变分页数据的js函数

*/

function pagination(currentPage,countPage,changeMethod){
  var str = "";
  var countNum;
  //head
        if (currentPage == 1) {
         str += "<a class=\"pagePre\">首页</a>";
            str += "<a >&lt;</a>";
        }
        else {
         str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"(1)\"  class=\"pagePre\">首页</a>";
            str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"("+(currentPage-1)+")\">&lt;</a>";
        }
  
        //pageNum
  if(currentPage < 4||countPage < 6){
   countNum = 1;
  }else if(currentPage + 2 > countPage){
   countNum = countPage - 4;
  }else{
   countNum = currentPage - 2;
  }
  
  var countPage1 = parseInt(countPage)+1;
  var countNum1 = parseInt(countNum);
  //body
  for(var i = countNum1; i < countPage1; i++){
   
   if(i==currentPage){ 
    str += "<span class=\"cur\">"+i+"</span>";
   }else{
    str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"("+i+")\">"+i+"</a>";
   }
   
   if(i == countNum + 4){
    break;
   }
   
  }
        //end
        if (currentPage == countPage) {
         str += "<a>&gt;</a>";
            str += "<a class=\"pagePre\">尾页</a>";
        }
        else {
            str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"("+(currentPage+1)+")\">&gt;</a>";
            str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"("+(countPage1-1)+")\" class=\"pagePre\">尾页</a>";
        }
  if(countPage1>2){
   $(".page").empty().append(str);
  }
 }

js分页模板的更多相关文章

  1. 【Java EE 学习 57】【酒店会员管理系统之分页模板书写】

    分页一直是一个比较麻烦的问题,特别是在我做的这个系统中更是有大量的分页,为了应对该问题,特地写了一个模板以方便代码重用,该模板包括后台分页的模板.前端显示的模板两部分. 一.分页分析 分页需要三种类型 ...

  2. 【7】使用css/js/html模板来实现一个注册、登录和管理的功能

    分支:auth static添加文件 css文件夹: app.css    自定义css样式[*] bootstrap.min.cs    bootstrap样式 compomemts文件夹: 插件用 ...

  3. Oracle数据库的SQL分页模板

    在系统开发过程中,需要对数据进行查询,大部分情况下从数据库中查询的数据量比较大,在系统页面无法全部显示,而且查询全部的数据会影响系统的反应速度,需要对所查询的数据进行分页的查询操作,以此减轻系统的压力 ...

  4. js分页小结

     今天解决了JS分页的问题1 页码 给每页的内容套一个相同的类名 通过选择器加上.length或者.size() 来获得总页数2当前页的页码可以使用each(function(index,DOMsss ...

  5. js使用模板快速填充数据

    1.html <!DOCTYPE html> <html> <head> <title>模板标签</title> </head> ...

  6. JS之模板技术(aui / artTemplate)

    artTemplate是个好东西啊,一个开源的js前端模板引擎,使用简单,渲染效率特别的高. 我经常使用这个技术来在前端动态生成新闻列表,排行榜,历史记录等需要在前端列表显示的信息. 下面是artTe ...

  7. velocity分页模板

    以前用后台java拼接分页代码,不利于修改.找到一份velocity模板. <!-- 分页模板 --> #macro(pager $url $pager) <url class=&q ...

  8. 自己封装的JS分页功能[用于搭配后台使用]

    * 2016.7.03 修复bug,优化代码逻辑 * 2016.5.25 修复如果找不到目标对象的错误抛出. * 2016.5.11 修复当实际页数(pageNumber)小于生成的页码间隔数时的bu ...

  9. jsp、js分页功能的简单总结

    一.概述 首先,我们要明确为何需要分页技术,主要原因有以下: 1.分页可以提高客户体验度,适当地选择合适的数据条数,让页面显得更有条理,使得用户体验感良好,避免过多数据的冗余. 2.提高性能的需要.分 ...

随机推荐

  1. JSON之FastJson

    FastJson是什么? 从网上查到--- 官网地址:http://code.alibabatech.com/wiki/display/FastJSON/Overview(已关闭) FastJSOn是 ...

  2. MVC5入门学习系列④

    添加Model且简单的使用EF 对于EF(EntityFramework)不了解的朋友可以去百度文科或者在园子里搜一些简资源看下,假如和我一样知道EF的概念,那么就知道EF有一个code first的 ...

  3. WCF、Web API、WCF REST、Web Service

    WCF.Web API.WCF REST.Web Service 区别 Web Service It is based on SOAP and return data in XML form. It ...

  4. mac下Android apk 破解流程

    相关工具下载:http://pan.baidu.com/s/1kTkOicn 首先你要有eclipse工具,在sdk目录下有如下工具可以使用 android:adb shell:进入交互shell  ...

  5. JAVA实例化class的三种方式

    不多说  直接上例子 package org.lxh.demo15.getclassdemo ; class X{ }; public class GetClassDemo02{ public sta ...

  6. css,js工具篇

    4. web前端开发分享-css,js工具篇   web前端开发乃及其它的相关开发,推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emm ...

  7. angularjs + seajs构建Web Form3

    angularjs + seajs构建Web Form前端(三) -- 兼容easyui 回顾 在上一章中使用了angular实现了ajax form和树形结构,经过以上两章对于angular的大致使 ...

  8. 【欧拉计划4】Largest palindrome product

    欢迎访问我的新博客:http://www.milkcu.com/blog/ 原文地址:http://www.milkcu.com/blog/archives/1371281760.html 原创:[欧 ...

  9. 安装dynamics CRM 2013提示“实例名称必须与计算机名称相同”

    在安装CRM 2013的时候,最后一步一直提示“实例名称必须与计算机名称相同”. 原因是在安装数据库之后,我更改了计算机名称.因此就导致了可这个错. 在安装数据库的时候,数据库会记住计算机的名称,用 ...

  10. Java字符串转换为日期和时间比较大小

    字符串转换为时间: String data = "2014/7/11"; SimpleDateFormat dfs = new SimpleDateFormat("yyy ...