简单的js分页脚本

2024-10-30 10:29:48

代码如下:

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script language="javascript" type="text/javascript" >
function showpage(url,num,c_p)
{
var prev=0;var next=0;var temp=0;var html="";
if(parseInt(c_p+3)>num)
{
prev=num;
}
else
{
prev=parseInt(c_p+3);
}
temp=10-(prev-c_p);
if(c_p-temp>0)
{
next=c_p-temp;
}
else
{
next=1;
}
//如果显示的第一页<10，总页数又大于10
if(c_p+3<10&&num>c_p+3)
{
for(j=1;j<=10-(c_p+3);j++)
{
prev++;
}
}
if(c_p!=num)
{
html+="<a href='"+url+"index="+(1+c_p)+"'>上一页</a>"+" ";
}
for (i=prev;i>=next;i--)
{
if (i==c_p)
{
html+="<font color=red>"+i+" </font>";
}
else
{
html+="<a href='"+url+"index="+i+"'>"+i+"</a>"+" ";
}
}
if(c_p!=1)
{
html+="<a href='"+url+"index="+(c_p-1)+"'>下一页</a>"+" ";
}
document.getElementById("pagenumber").innerHTML=html+" 转到<input id=\"page\" style=\"width: 33px\" />页 <input type=\"button\" value=\"go\" onclick=\"funcGo()\" />";
}
function funcLoad()
{
var num=100;
var url="testpager.html?";
var index ;
index = getUrlParam("index");
if(index==0)
{
index=num;
}
showpage(url,num,index);
}
function getUrlParam(name)
{
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r!=null)
{
return parseInt(unescape(r[2]));
}
return 0;
}
function funcGo()
{
var num=100;
if(parseInt(document.getElementById("page").value)>0&&parseInt(document.getElementById("page").value)<=num)
{
window.location.href="testpager.html?index="+parseInt(document.getElementById("page").value);
}
else
{
alert("页码不存在！");
return false;
}
}
</script>
</head>
<body onload="funcLoad(0)">
<form id="form1" runat="server">
<div id="pagenumber">
</div>
</form>
</body>
</html>

JS分页效果示例

分页复制代码代码如下: <script type="text/javascript" language="javascript" src="js/pager.js"></script> 复制代码代码如下: /*--------pager-------*/ .number span a{padding:4px 6px;} .number span a:hover{padding:4px 6px; background-
JS分页控件可用于无刷新分页

JS分页控件,可用于无刷新分页复制代码代码如下: function PagerBar(recordcount, pagesize, pageindex, showpagecount) { var NumberRegex = new RegExp(/^\d+$/); this.PageIndex = 1; //页索引,当前页 if (pageindex != null && NumberRegex.test(pageindex)) this.PageIndex =
js分页显示div的内容

div分页显示_我们_www.jb51.net #frameContent{ width:500px; /*调整显示区的宽*/ height:200px; /*调整显示区的高*/ font-size:14px; line-height:20px; border:1px solid #000000; overflow-pageINdex:hidden; overflow-y:hidden; word-break:break-all; } a{ font-size:12px; color:#0000
简单的js分页脚本

复制代码代码如下: <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> </script>
基于JS分页控件实现简单美观仿淘宝分页按钮效果

最新版本代码请移步到https://github.com/pgkk/kkpager 在线测试链接:http://pgkk.github.io/kkpager/example/pager_test.html 分页按钮思想: 1.少于9页,全部显示 2.大于9页,1.2页显示,中间页码当前页为中心,前后各留两个页码附件中有完整例子的压缩包下载.已更新到最新版本先看效果图: 01输入框焦点效果 02效果模仿淘宝的分页按钮效果控件kkpager JS代码: Js代码 var kkpager = {
纯js分页代码(简洁实用)

复制代码代码如下: //每页显示字数PageSize=5000;//分页模式flag=2;//1:根据字数自动分页 2:根据[NextPage]分页//默认页startpage = 1;//导航显示样式 0:常规 1:直接 3:下拉TopShowStyle = 1;DownShowStyle = 0; var currentSet,CutFlag,TotalByte,PageCount,key,tempText,tempPage; key=""; currentSet=0; var
分享两段简单的JS代码防止SQL注入

1.URL地址防注入: //过滤URL非法SQL字符 var sUrl=location.search.toLowerCase(); var sQuery=sUrl.substring(sUrl.indexOf("=")+1); re=/select|update|delete|truncate|join|union|exec|insert|drop|count|'|"|;|>|<|%/i; if(re.test(sQuery)) { alert("请勿
非常不错的一个JS分页效果代码，值得研究

本来想用网上找来的分页程序,不过都得做修改,感觉麻烦了,还是自己写一个好了,以后自己用的时候修改就方便了~~大家都多动手,自己写的才是最好的,日后想干什么的,做修改也是很容易的~~顺便也扩充一下自己的代码库~~ 补充一句,cpage是页面计数,应为全局变量,这样可以随处调用它,totalpage是总页数 JS静态分页程序 a:link,a:visited,a:hover,.current,#info{ border:1px solid #DDD; background:#F2F2F2; disp
Vue.js分页组件实现：diVuePagination的使用详解

一.介绍 Vue.js 是什么 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合.另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动. 二.创建初始化项目这里不在详细说明,我们的分页演示只需要vue和vue-router就可以了,我们直接构建项目和设置配置. main.js:
jquery.pagination.js分页使用教程

简单介绍一下在动态网页里面的jquery.pagination.js分页的使用,具体内容如下添加下载的js和样式,主要是先添加jquery.js 再添加jquery.pagination.js,我这是下载好的,放在本地 <link rel="stylesheet" href="<%=path%>css/pagination.css" type="text/css"> <script type="text/
完美的ASP分页脚本代码

直接写成函数的形式,如果输出生成好的页码,然后又程序输出或保存到文件中. 前十页为一批,第十页显示1,2,3-10:第十一页页码就变成了11,12-20 这种模式很多CMS都用到,比如5UCMS.函数名留点版权信息吧,cs=CatSeven <% function csPage(id,all,url1,url2) if id<>1 then tmp="<a href=""" rel="external nofollow"
node.js调用脚本(python/shell)和系统命令

每种语言都有自己的优势,互相结合起来各取所长程序执行起来效率更高或者说哪种实现方式较简单就用哪个,nodejs是利用子进程来调用系统命令或者文件,文档见http://nodejs.org/api/child_process.html,NodeJS子进程提供了与系统交互的重要接口,其主要API有: 标准输入.标准输出及标准错误输出的接口. NodeJS 子进程提供了与系统交互的重要接口,其主要 API 有: 标准输入.标准输出及标准错误输出的接口 child.stdin 获取标准输入 child.
基于twbsPagination.js分页插件使用心得(分享)

项目中之前需要分页插件,以前用的都是单纯叫做pagenation.js的插件,但是这次集成的时候,项目组一个孩纸用了这个插件,结合网上的例子琢磨了一把.其实大致流程都是相同的,主要将我在用这个分页插件的一些心得分享出来: 1.分页插件引入html中需要: bootstrap.css 分页插件js 自己写的分页的样式css[如果不用,也可以直接用bootstrap所带的分页css.] 使用jquery可以引入jquery.js html中: <script type="text/javasc

简单的js分页脚本

相关推荐

随机推荐