`
rigger21
  • 浏览: 131476 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

JS静态分页程序

阅读更多
<script>function StorePage(){d=document;t=d.selection?(d.selection.type!='None'?d.selection.createRange().text:''):(d.getSelection?d.getSelection():'');void(keyit=window.open('http://www.365key.com/storeit.aspx?t='+escape(d.title)+'&u='+escape(d.location.href)+'&c='+escape(t),'keyit','scrollbars=no,width=475,height=575,left=75,top=20,status=no,resizable=yes'));keyit.focus();}</script>

<html>
<head>
<title>JS静态分页程序</title>
</head>
<style type="text/css">
a:link,a:visited,a:hover,.current,#info{
border:1px solid #DDD;
background:#F2F2F2;
display:inline-block;
margin:1px;
text-decoration:none;
font-size:12px;
width:15px;
height:15px;
text-align:center;
line-height:15px;
color:#AAA;
padding:1px 2px;
}
a:hover{
border:1px solid #E5E5E5;
background:#F9F9F9;
}
.current{
border:1px solid #83E7E4;
background:#DFF9F8;
margin:1px;
color:#27CBC7;
}
#info{
width:auto;
}
</style>


<body>
<div id="setpage"></div>
<script type="text/javascript">
<!--
var totalpage,pagesize,cpage,count,curcount,outstr;
//初始化
cpage = 1;
totalpage = 56;
pagesize = 10;
outstr = "";

function gotopage(target)
{
cpage = target; //把页面计数定位到第几页
setpage();
//reloadpage(target); //调用显示页面函数显示第几页,这个功能是用在页面内容用ajax载入的情况
}

function setpage()
{

if(totalpage<=10){ //总页数小于十页
for (count=1;count<=totalpage;count++)
{ if(count!=cpage)
{
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+count+")'>"+count+"</a>";
}else{
outstr = outstr + "<span class='current' >"+count+"</span>";
}
}
}

if(totalpage>10){ //总页数大于十页
if(parseInt((cpage-1)/10) == 0)
{
for (count=1;count<=10;count++)
{ if(count!=cpage)
{
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+count+")'>"+count+"</a>";
}else{
outstr = outstr + "<span class='current'>"+count+"</span>";
}
}
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+count+")'> next </a>";
}
else if(parseInt((cpage-1)/10) == parseInt(totalpage/10))
{
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+(parseInt((cpage-1)/10)*10)+")'>previous</a>";
for (count=parseInt(totalpage/10)*10+1;count<=totalpage;count++)
{ if(count!=cpage)
{
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+count+")'>"+count+"</a>";
}else{
outstr = outstr + "<span class='current'>"+count+"</span>";
}
}
}
else
{
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+(parseInt((cpage-1)/10)*10)+")'>previous</a>";
for (count=parseInt((cpage-1)/10)*10+1;count<=parseInt((cpage-1)/10)*10+10;count++)
{
if(count!=cpage)
{
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+count+")'>"+count+"</a>";
}else{
outstr = outstr + "<span class='current'>"+count+"</span>";
}
}
outstr = outstr + "<a href='javascript:void(0)' onclick='gotopage("+count+")'> next </a>";
}

}
document.getElementById("setpage").innerHTML = "<div id='setpage'><span id='info'>共"+totalpage+"页|第"+cpage+"页<\/span>" + outstr + "<\/div>";
outstr = "";
}


setpage(); //调用分页

//-->
</script>


</body>
</html>

分享到:
评论

相关推荐

    div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格

    div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格 百分比表格(用DIV+CSS)以百分比显示,可以根据窗口的大小自动调节所显示的大小! DIV+CSS+JS静态分页程序可兼容主流浏览器(IE、FF、Opera) DIV+CSS表格...

    ASP源码—AJAX 静态分页示例.zip

    在本示例中,"ASP源码—AJAX 静态分页示例.zip" 提供了一个使用ASP和AJAX技术实现静态分页功能的代码实例。这涉及到两个主要的技术领域:ASP和AJAX,它们在网页开发中都扮演着重要的角色。 1. ASP(Active Server ...

    jsp生成静态页并分页

    **标题:“jsp生成静态页并分页”** 在Web开发中,JSP(JavaServer Pages)是一种常用的动态网页技术,允许开发者将HTML代码与Java代码混合编写,从而实现动态内容的生成。本话题主要探讨如何利用JSP技术来生成静态...

    AspNet+JS生成静态页并分页

    本文将深入探讨如何结合JavaScript技术,在Asp.NET环境下生成静态页面并实现分页功能。 首先,Asp.NET生成静态页是提高网站性能的一个有效策略。静态页面可以直接由Web服务器提供,无需经过编译和执行服务器端代码...

    Asp+AJAX静态分页 亲测 可用

    Asp+AJAX静态分页 亲测 可用 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html&gt; &lt;head&gt; &lt;meta ...

    C#分页和生产静态页面

    在C#中,可以使用各种工具和库来生成静态页面,如Razor Pages、Sapper或Next.js(尽管后者主要是JavaScript框架,但可以通过服务器端渲染功能与C#结合使用)。生成静态页面通常涉及以下步骤:动态生成HTML内容,可能...

    javascript分页效果code

    &lt;title&gt;JS静态分页程序&lt;/title&gt; &lt;/head&gt; &lt;style type="text/css"&gt; a:link,a:visited,a:hover,.current,#info{ border:1px solid #DDD; background:#F2F2F2; display:inline-block; margin:1px; text-...

    asp+ajax静态分页

    &lt;script language="javascript" type="text/javascript"&gt; &lt;!-- function createAjax() { //该函数将返回XMLHTTP对象实例 var _xmlhttp; try { _xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); //IE的创建...

    分页插件与静态页面管理

    ### 分页插件与静态页面管理 #### 一、静态页面管理 静态页面是指那些无需服务器端脚本处理,直接由浏览器解析显示的网页。在Web应用开发中,静态页面通常用于展示固定的信息或者作为动态内容的基础框架。为了更好...

    asp.net实现url伪静态及分页

    3. **UI展示**:在前端,可以使用HTML和CSS创建分页链接,或者使用JavaScript库如jQuery分页插件来实现交互式分页。 总的来说,ASP.NET提供了强大的工具和灵活性,帮助开发者实现URL伪静态和分页功能,从而提升网站...

    DoubleY自动生成HTML全站静态程序 3.0.rar

    DoubleY自动生成HTML全站静态程序,喜欢pj,喜欢wp,喜欢o-blog,喜欢cms等优秀程序的您,不妨花点点时间体验下这款傻瓜式全站静态体验型程序!专为“中小企业”、“设计师”、“个人博客”、“SEO推广”打造的轻量级...

    静态相册程序

    【静态相册程序】是一种基于前端技术实现的网页相册展示方案,主要利用JavaScript库jQuery来动态处理图像,实现各种交互效果。在这个场景下,"MergingImageBoxes"可能是指一个特定的相册插件或者代码示例,用于将多...

    asp静态生成及分页(带进度条)

    在本实例中,"asp静态生成及分页(带进度条)"是指使用ASP技术来实现页面的静态化,并结合分页功能,同时加入了进度条的视觉效果,为用户提供更好的交互体验。 1. 静态生成: 静态生成是将动态内容转化为HTML静态...

    生成静态页面和分页主要的原理

    分页实现可以通过服务器端计算或者客户端JavaScript实现,前者需要服务器参与每次跳转,后者则在用户端进行计算和页面更新,减轻了服务器压力。 4. **数据库交互**: 数据库是动态内容的存储库,当需要生成静态...

    node.js+express+mysql实现增删改查+分页+文件上传

    在本文中,我们将深入探讨如何使用Node.js、Express框架和MySQL数据库来构建一个功能完备的Web应用程序,包括数据的增删改查(CRUD)操作、分页功能以及图片的上传处理。首先,我们先来了解这三个核心组件。 **Node...

    静态页面生成加分页实例

    例如,可以先通过后台程序生成每个分页的静态HTML文件,然后在前端通过JavaScript或者AJAX实现分页效果,这样既保留了静态页面的加载优势,又保持了交互性。在ASP.NET项目中,这可以通过异步任务或者计划任务来实现...

    分页控件;分页控件;分页控件

    - **JavaScript**:常见的库如jQuery UI、Bootstrap、AngularJS和Vue.js都提供了分页组件。 - **PHP**:例如Laravel框架内置了分页功能,可以轻松实现。 - **Java**:Spring Boot框架提供了Pageable接口和Page对象,...

    ASP源码—生成静态HTML完整实例(包括列表分页).zip

    这个"ASP源码—生成静态HTML完整实例(包括列表分页).zip"压缩包文件包含了利用ASP技术实现静态HTML页面生成及列表分页功能的示例代码。下面将详细阐述这一主题的相关知识点。 1. **ASP基础概念**:ASP是Web开发的一...

    封装好的javascript前端分页插件pagination

    1. **无依赖性**:与其他分页插件相比,pagination不需要依赖于如jQuery、Vue、React等任何流行的JavaScript库或框架,这使得它可以在任何现代浏览器环境中使用,无论是简单的静态页面还是复杂的单页面应用程序(SPA...

    AJAX表态页面分页

    本主题将深入探讨如何使用 AJAX 实现静态分页。 一、AJAX 基础 1. XMLHttpRequest 对象:AJAX 的基础是 XMLHttpRequest 对象,它允许 JavaScript 在后台与服务器进行通信。通过创建 XMLHttpRequest 实例,我们可以...

Global site tag (gtag.js) - Google Analytics