效果图:

大概思路：使用ul进行初始布局，每一次点击事件改变li里的值。
完整的代码在gitup上：https://github.com/anxizhihai/Paging.git
css部分:

html部分:

JQuery部分:

												


											
JQuery手写一个简单的分页的更多相关文章
	

    
								
  1. jquery 手写一个简单浮窗的反面教材
		
    前言 初学jquery写的代码,陈年往事回忆一下. 正文 介绍一下大体思路 思路: 1.需要控制一块区域,这块区域一开始是隐藏的. 2.这个区域需要关闭按钮,同时我需要写绑定事件,关闭的时候让这块区域 ...
    
		
    2. 
						
  2. JQuery手写一个简单的轮播图
		
    做出来的样式: 没有切图,就随便找了一些图片来实现效果,那几个小星星萌不萌. 这个轮播图最主要的部分是animate(),可以先熟悉下这个方法. 代码我放到了github上,链接:https://gi ...
    
		
    3. 
						
  3. 利用SpringBoot+Logback手写一个简单的链路追踪
		
    目录 一.实现原理 二.代码实战 三.测试 最近线上排查问题时候,发现请求太多导致日志错综复杂,没办法把用户在一次或多次请求的日志关联在一起,所以就利用SpringBoot+Logback手写了一个简 ...
    
		
    4. 
						
  4. 手写一个简单的ElasticSearch SQL转换器(一)
		
    一.前言 之前有个需求,是使ElasticSearch支持使用SQL进行简单查询,较新版本的ES已经支持该特性(不过貌似还是实验性质的?) ,而且git上也有elasticsearch-sql 插件, ...
    
		
    5. 
						
  5. 手写一个简单的starter组件
		
    spring-boot中有很多第三方包,都封装成starter组件,在maven中引用后,启动springBoot项目时会自动装配到spring ioc容器中. 思考: 为什么我们springBoot ...
    
		
    6. 
						
  6. 手写一个简单的HashMap
		
    HashMap简介 HashMap是Java中一中非常常用的数据结构,也基本是面试中的"必考题".它实现了基于"K-V"形式的键值对的高效存取.JDK1.7之前 ...
    
		
    7. 
						
  7. 手写一个简单到SpirngMVC框架
		
    spring对于java程序员来说,无疑就是吃饭到筷子.在每次编程工作到时候,我们几乎都离不开它,相信无论过去,还是现在或是未来到一段时间,它仍会扮演着重要到角色.自己对spring有一定的自我见解, ...
    
		
    8. 
						
  8. 手写一个简单版的SpringMVC
		
    一 写在前面 这是自己实现一个简单的具有SpringMVC功能的小Demo,主要实现效果是; 自己定义的实现效果是通过浏览器地址传一个name参数,打印“my name is”+name参数.不使用S ...
    
		
    9. 
						
  9. socket手写一个简单的web服务端
		
    直接进入正题吧,下面的代码都是我在pycharm中写好,再粘贴上来的 import socket server = socket.socket() server.bind(('127.0.0.1',  ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. csharp:Convert Image to Base64 String and Base64 String to Image
			
    /// <summary> /// 图像转成二进制数组 /// </summary> /// <param name="imageIn">< ...
    
			
    2. 
						
  2. 浅谈jquery中prop()和attr()
			
    我们都知道,一般在jquery中设置属性时要用到attr()方法,现在我们有一个效果,点击按钮切换复选框的选中状态,下面贴出html代码: <input type="checkbox& ...
    
			
    3. 
						
  3. 记录开发Nodejs c++ addon的一些经验（三、关于node-gyp）
			
    关于node-gyp如何进行编译,我想它的官网已经说的很详细了: https://github.com/nodejs/node-gyp 但是我感觉关于binding.gyp文件的语法规则还是说的不明确 ...
    
			
    4. 
						
  4. 关于webuploader 在ie9上不能触发 input 的 change 事件
			
    上传文件用了 webuploader,ie9以上及其它浏览器正常执行js ,但是在ie9上点击input 无效,不能触发change 事件. 第一反应是ie9 需要使用flash 上传文件 原因: . ...
    
			
    5. 
						
  5. Repeat Number（数论）
			
    Repeat Number 题目描述: Definition: a+b = c, if all the digits of c are same ( c is more than ten), then ...
    
			
    6. 
						
  6. 添加CentOS扩展源
			
    参考: http://blog.onovps.com/archives/centos-yum-epel.html https://fedoraproject.org/wiki/EPEL/zh-cn h ...
    
			
    7. 
						
  7. “云中论道”之——使用开源技术和Azure公有云服务快速搭建云端IoT解决方案（上）
			
    “云中论道”技术课堂第一课开讲啦!微软各路技术咖们齐聚一堂,为大家带来干货不断!作为“云中论道“课堂的开课之作,我们首先邀请到了微软Azure专家级的架构师:槐长清,他为我们带来了关于“使用开源技术和 ...
    
			
    8. 
						
  8. js前台检测上传图片大小的总结
			
    最近一直在做上传图片的前端检测,不通过后台就完成这个动作.但实际是,实际效果差强人意. html5的fileApi出来后,对文件的处理才变得方便了些,对它的简单介绍可以看我的前面的博客.现在支持的浏览 ...
    
			
    9. 
						
  9. PowerShell管理Azure
			
    PowerShell第一次连接Azure1.下载Azure SDK,安装azure powershell http://azure.microsoft.com/zh-cn/downloads/?rnd ...
    
			
    10. 
						
  10. 文本处理三剑客之 Sed ——高级编辑命令
			
    本篇介绍sed的高级编辑命令 高级编辑命令 P:打印模式空间开端至\n内容,并追加到默认输出之前 n: 读取匹配到的行的下一行覆盖至模式空间 N:读取匹配到的行的下一行追加至模式空间 h: 把模式空间 ...
    
			
    11.