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

javascript分页代码

阅读更多

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Javascript分页</title>
<script type="text/javascript">
var page=1;
var pagesize=2;//每页显示数量
var picnum=9;//图片总数量
var pagenum;
var showpage='';
var showpage1='';
function showpic(no) {
page=no;
pagenum=picnum/pagesize;
if (picnum%pagesize>0) pagenum=parseInt(picnum/pagesize)+1;
document.getElementById("img").innerHTML='';
for (i=1;i<=picnum;i++){
if(i > (page-1)*pagesize && i<=page*pagesize){
document.getElementById("img").innerHTML+='<img src='+i+'.jpg>';
}
}
if (page>1){
showpage='<a href="javascript:showpic(1);">首页</a> <a href="javascript:showpic('+(page-1)+');">上一页</a>'
}else{
showpage='';
}
if (page<pagenum){
showpage1=' <a href="javascript:showpic('+(page+1)+');">下一页</a> <a href="javascript:showpic('+pagenum+');">尾页</a> '
}else{
showpage1='';
}
document.getElementById("pages").innerHTML='页次:'+page+'/<font color=red>'+pagenum+'</font>  共:<font color=red>'+picnum+'</font> 条 '+showpage+showpage1;
}
window.onload=function(){
showpic(1);
}
</script>
</head>

<body>
<div id="img"></div>
<div id="pages"></div>
</body>
</html>

分享到:
评论

相关推荐

    经典JavaScript分页代码

    这个经典JavaScript分页代码实现了一个名为`Page`的类,用于处理分页逻辑。下面将详细解析这个代码中的关键知识点。 1. **类定义与构造函数**: 类`Page`通过构造函数接收三个参数:`iAbsolute`(每页显示记录数)...

    10种JavaScript分页代码.rar

    这个"10种JavaScript分页代码.rar"压缩包文件包含了一系列实现JavaScript分页功能的源代码示例,旨在帮助开发者理解和应用不同的分页策略。 1. 基本原理: 分页的基本思想是将大量数据分成若干小块(页),每次只...

    Javascript分页代码

    本文将详细解析提供的JavaScript分页代码及其调用方式。 首先,我们来看核心的`showpage()`函数: ```javascript function showpage(url, num, c_p) { if (num ) { stnum = num; } else { stnum = 8; } for ...

    10种JavaScript分页代码

    这些分页代码示例提供了多种实现方式,可以帮助开发者理解和应用JavaScript分页功能。 首先,JavaScript分页的核心原理是通过计算当前页面的数据范围,根据总数据量和每页显示的数量来生成相应的导航链接。当用户...

    Javascript分页效果(收集了很多强大的JS分页代码)

    这个压缩包中包含了多个JavaScript分页代码示例,适合网页开发者参考和直接应用。 分页效果的实现通常包括以下几个核心部分: 1. 数据获取:首先,需要获取要分页展示的数据。这些数据可以来源于服务器端(如通过...

    javascript分页代码实例分享(js分页)

    调用: 代码如下:var pageChange = function (index) { var ... 代码如下:pager = function (divPager, pageIndex, pageSize, totalCount, pageChange, opt) { var theOpt = { barSize: 5, //分页条显示的页码数

    多种JS用户分页代码

    下面将详细介绍这些JavaScript分页代码的关键知识点。 1. **基础概念** - **分页**:分页是将大量数据分割成多个小块(页),每次只加载一部分,以提高网页加载速度和用户体验。 - **JavaScript**:一种轻量级的...

    js table设置表格行tr分页代码简单的分页代码下载

    以下是一个简单的JavaScript分页代码示例: ```javascript // 假设这是你的数据源 let dataSource = [...]; // 这里填写你的数据 // 每页显示的行数 const pageSize = 10; // 当前页数 let currentPage = 1; // ...

    javascript分页代码(当前页码居中)

    在JavaScript分页代码实现中,经常会出现需求让当前页码居中显示,这样可以方便用户快速定位到当前浏览的页面。 在提供的代码片段中,作者提到了一个名为`setPage`的函数。这个函数接收一个名为`opt`的参数,这个...

    jquery分页程序,js分页代码

    **jQuery分页程序和JavaScript分页代码详解** 在网页开发中,当数据量过大时,为了提高用户体验,通常会采用分页技术来展示数据。本篇文章将深入探讨JavaScript(JS)和jQuery实现分页的原理与方法。 首先,我们要...

    10种JS分页代码

    本篇文章将详细介绍10种JavaScript分页代码实现方式,帮助你理解和掌握这一关键技能。 1. **基础HTML+CSS+JS分页**:最简单的分页实现,通过JavaScript计算总页数,创建HTML元素,绑定点击事件,更新显示内容。 2....

    js分页示例,前台分页,客户端分页,分页机制,js分页

    例如,下面是一个简单的JavaScript分页代码片段: ```javascript let data = [/* your data array */]; let pageSize = 10; let currentPage = 1; function renderPage() { let startIndex = (currentPage - 1) * ...

    javaScript分页

    JavaScript分页是网页开发中一个常见且重要的功能,它用于处理大量数据的显示,通过将数据分割成小块,逐页加载,提高了用户体验并优化了页面性能。在本项目中,我们将探讨如何使用纯JavaScript实现分页功能,以及...

    js分页代码,分页代码

    根据提供的文件信息,我们可以总结出以下关于使用JavaScript实现分页技术的相关知识点: ### 一、JavaScript 分页技术概述 在Web开发中,特别是在处理大量数据时,为了提高用户体验和减轻服务器压力,通常会采用...

    非要优秀的前端js 分页代码

    本文将详细介绍一种优秀的前端JavaScript分页代码及其应用场景、实现原理和优化策略。 首先,我们要理解前端分页的基本需求。在网页上,当数据集过大时,我们不会一次性加载所有数据,而是分批加载,每批数据对应一...

    JavaScript脚本分页代码

    JavaScript脚本分页代码是网页开发中常见的功能,主要用于处理大量数据时的用户界面优化,使得用户能够逐页浏览信息,而不是一次性加载所有内容。在本文中,我们将深入探讨JavaScript如何实现这一功能,并提供相关...

    经典的10种JS分页代码

    3. **纯JavaScript分页**:不依赖任何外部库,通过JavaScript实现分页逻辑。例如,可以使用数组或对象存储数据,根据当前页数动态渲染页面内容。 4. **AJAX分页**:使用AJAX异步加载数据,用户在切换页面时无需刷新...

    JS+HTML分页代码

    本示例提供的"JS+HTML分页代码"是一个利用JavaScript(JS)和超文本标记语言(HTML)实现的分页功能,主要包含了首页、前页、后页、尾页以及自定义分页页号的功能。 **HTML基础**: HTML是网页的基础,用于构建页面...

    javascript 分页模块

    7. **类库与插件**:在实际开发中,我们往往使用现有的JavaScript分页库,如`bootstrap-paginator.js`、`pager.js`或本案例中的`Cls_jsPage.js`,这些库封装了上述逻辑,提供更易用的API。 8. **示例代码**:`demo....

Global site tag (gtag.js) - Google Analytics