js分页模板
/**
*参数说明:
*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 ><</a>";
}
else {
str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"(1)\" class=\"pagePre\">首页</a>";
str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"("+(currentPage-1)+")\"><</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>></a>";
str += "<a class=\"pagePre\">尾页</a>";
}
else {
str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"("+(currentPage+1)+")\">></a>";
str += "<a href=\"javascript:void(0)\" onclick=\""+changeMethod+"("+(countPage1-1)+")\" class=\"pagePre\">尾页</a>";
}
if(countPage1>2){
$(".page").empty().append(str);
}
}
js分页模板的更多相关文章
- 【Java EE 学习 57】【酒店会员管理系统之分页模板书写】
分页一直是一个比较麻烦的问题,特别是在我做的这个系统中更是有大量的分页,为了应对该问题,特地写了一个模板以方便代码重用,该模板包括后台分页的模板.前端显示的模板两部分. 一.分页分析 分页需要三种类型 ...
- 【7】使用css/js/html模板来实现一个注册、登录和管理的功能
分支:auth static添加文件 css文件夹: app.css 自定义css样式[*] bootstrap.min.cs bootstrap样式 compomemts文件夹: 插件用 ...
- Oracle数据库的SQL分页模板
在系统开发过程中,需要对数据进行查询,大部分情况下从数据库中查询的数据量比较大,在系统页面无法全部显示,而且查询全部的数据会影响系统的反应速度,需要对所查询的数据进行分页的查询操作,以此减轻系统的压力 ...
- js分页小结
今天解决了JS分页的问题1 页码 给每页的内容套一个相同的类名 通过选择器加上.length或者.size() 来获得总页数2当前页的页码可以使用each(function(index,DOMsss ...
- js使用模板快速填充数据
1.html <!DOCTYPE html> <html> <head> <title>模板标签</title> </head> ...
- JS之模板技术(aui / artTemplate)
artTemplate是个好东西啊,一个开源的js前端模板引擎,使用简单,渲染效率特别的高. 我经常使用这个技术来在前端动态生成新闻列表,排行榜,历史记录等需要在前端列表显示的信息. 下面是artTe ...
- velocity分页模板
以前用后台java拼接分页代码,不利于修改.找到一份velocity模板. <!-- 分页模板 --> #macro(pager $url $pager) <url class=&q ...
- 自己封装的JS分页功能[用于搭配后台使用]
* 2016.7.03 修复bug,优化代码逻辑 * 2016.5.25 修复如果找不到目标对象的错误抛出. * 2016.5.11 修复当实际页数(pageNumber)小于生成的页码间隔数时的bu ...
- jsp、js分页功能的简单总结
一.概述 首先,我们要明确为何需要分页技术,主要原因有以下: 1.分页可以提高客户体验度,适当地选择合适的数据条数,让页面显得更有条理,使得用户体验感良好,避免过多数据的冗余. 2.提高性能的需要.分 ...
随机推荐
- JSON之FastJson
FastJson是什么? 从网上查到--- 官网地址:http://code.alibabatech.com/wiki/display/FastJSON/Overview(已关闭) FastJSOn是 ...
- MVC5入门学习系列④
添加Model且简单的使用EF 对于EF(EntityFramework)不了解的朋友可以去百度文科或者在园子里搜一些简资源看下,假如和我一样知道EF的概念,那么就知道EF有一个code first的 ...
- 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 ...
- mac下Android apk 破解流程
相关工具下载:http://pan.baidu.com/s/1kTkOicn 首先你要有eclipse工具,在sdk目录下有如下工具可以使用 android:adb shell:进入交互shell ...
- JAVA实例化class的三种方式
不多说 直接上例子 package org.lxh.demo15.getclassdemo ; class X{ }; public class GetClassDemo02{ public sta ...
- css,js工具篇
4. web前端开发分享-css,js工具篇 web前端开发乃及其它的相关开发,推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emm ...
- angularjs + seajs构建Web Form3
angularjs + seajs构建Web Form前端(三) -- 兼容easyui 回顾 在上一章中使用了angular实现了ajax form和树形结构,经过以上两章对于angular的大致使 ...
- 【欧拉计划4】Largest palindrome product
欢迎访问我的新博客:http://www.milkcu.com/blog/ 原文地址:http://www.milkcu.com/blog/archives/1371281760.html 原创:[欧 ...
- 安装dynamics CRM 2013提示“实例名称必须与计算机名称相同”
在安装CRM 2013的时候,最后一步一直提示“实例名称必须与计算机名称相同”. 原因是在安装数据库之后,我更改了计算机名称.因此就导致了可这个错. 在安装数据库的时候,数据库会记住计算机的名称,用 ...
- Java字符串转换为日期和时间比较大小
字符串转换为时间: String data = "2014/7/11"; SimpleDateFormat dfs = new SimpleDateFormat("yyy ...