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

javascript分页代码

JavaScriptHTML 
阅读更多

<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>

分享到：
| eclipse加tomcat开发web程序
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    经典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....

Magicbox
Global site tag (gtag.js) - Google Analytics