拖动分页 body{ border:0px; margin:0px; overflow:hidden; background-color:transparent; font-family:宋体; } .page{ position:absolute; width:700px; border:1px solid #999; background-color:#000; left:425px; margin-left:-350px; cursor:default; z-index:0; } ul{ height:320px; list-style:none; margin:40px 50px 0px; padding:0px; } li{ width:100%; height:30px; line-height:30px; fo...
代码如下: 原料库管理 function Page(iAbsolute,sTableId,sTBodyId,page) { this.absolute = iAbsolute; //每页最大记录数 this.tableId = sTableId; this.tBodyId = sTBodyId; this.rowCount = 0;//记录数 this.pageCount = 0;//页数 this.pageIndex = 0;//页索引 this.__oTable__ = null;//表格引用 this.__oTBody__ = null;//要分页内容 this.__dataRows__ = 0;//记录行引用 this.__oldTBody__ = null; this.__init__...
先把要用到的文件依次进入进来: 代码如下: 接着在页面的body里面写入如下的代码,在这里强调一下呈现出来的数据是没有进行控件绑定的,完全是由简单的table来呈现数据的,先看一下页面代码 代码如下: 产品名称 产品单价 我们先分析一下代码,很明显我们设定了一个标准的带有的表格,然后再加上了我们使用到的Jquery的插件—Paination,在这里我们只需定义一下一个以id为Pagination的层就可以了。页面的代码我...
代码如下: jquery分页控件 10 20 30 首页 上一页 下一页 最后一页 of0 var pageindex=1; var totelsize=60; var centersize=5; var pagesize=0; var totelSec=0; var outStr=""; var se="" +"5" +"10" +"15" +""; var firstdiv="首页"; var prediv="上一页"; var centerdiv=""; var nextdiv="下一页"; var lastdiv="最后一页"; $('.pager').empty(); $('.pager').append(se) $('.pager').append(firstdiv) $('.pag...
前端时间因为项目需要,要对一个产品下所有的附属图片进行分页显示,没考虑ajax一张张请求,所以干脆一次性全部把图片out,然后在载入的时候进行分页,网上很多jquery,property等都实现了但是他们插件的附属功能很多又不需要,而且没必要就为了这么一个功能区引用这个库,为速度考虑吧,当然你服务器好也行,但是其实这个效果不是必须的,但是觉的会常用,所以就包装成类了,供以后使用,也供有需要的人学习使用。 下面只是一个简单...
如果你所在公司的开发环境或者项目的开发环境处于单一语言的开发环境之中,框架不适用,因为框架的使用范围之一就是针对一个项目中存在多个语言开发的业务模块,而新项目都需要这些模块的功能,按照以前的习惯,肯定是重新开发,至少也是将其他的语言开发的业务功能变成webservice接口供新代码调用,在这种情况下,本文讨论的框架就可以派上用场并且还能在客户端消除语言差异,只使用纯javascript和html静态代码进行开发。 当然即使...
每次请求备份管理页面时,服务端会把所以的备份还原信息都传到客户端,然后ui.tabs将两种信息折叠起来分别显示,好在ui.tabs给我提供ajax功能,我们的每个tab可以直接应用另外一个页面 如: 代码如下: 备份 还原 但这样,当Restore.aspx存在服务端控件时,当他与服务端交互时,将不会很理想,比如GridView自带排序,分页就不可能实现,因为每一次交互他总是他只会显示你第一次加载该tab的状态(gridview它可能总是显示的第一...
一个模板,从数据库取n条记录,生成静态。 做单页面的静态化,索引页面是用JS对数组进行组合的。 因为记录只是一个标题,一个链接,字节数不会太大, 那么用js去用这个大数组进行分页,貌似不错,很节约带宽! 还是很棒的,简单,实用,值得推荐! JS代码: 代码如下: function title_array(title, link_add, store_time) { this.title = title; this.link_add = link_add; this.store_time = store_time; } var ii = 0; var item = ...
没什么技术含量,先上图: 思路: 1:获取按键 2:判断当前表格行的位置 HTML结构: 代码如下: firstname: lastname: age: percent: Peter Parker 28 20.9% John Hood 33 25% Clark Kent 18 44% style样式: 代码如下: body{ font-family:"微软雅黑"; font-size:12px; } table{ text-align:center; } th{ height:30px; border-bottom:1px dashed #ccc; } td{ height:30px; border-bottom:1px dashed #ccc; } .bak...
理由:jquery简单,兼容性好且容易封装。废话不多说,马上开始我们的Jquery插件编写吧。应该有很多人写过类似的插件,我也是有些模仿flexGrid的形式。 需求:GridView显示数据,无刷新分页,无刷新排序,无刷新过滤(搜索数据),基于ASP.NET(我们这里有ashx一般处理文件来实现)。 使用到技术:asp.net2.0, jquery,css 首先写的是jquery插件方面,使用的核心函数还是jquery的ajax函数,方便快捷。 代码如下: $.ajax({ type: p.met...
具体内容我没有做测试。仅供参考 代码 代码如下: 新闻测试1新闻测试1 新闻测试2新闻测试2 新闻测试3新闻测试3 新闻测试4新闻测试4 新闻测试5新闻测试5 新闻测试6新闻测试6 新闻测试7新闻测试7 新闻测试8新闻测试8 新闻测试9新闻测试9 JS 代码部分。js部分代码比较简单。 重要的就几XML 操作函数 代码如下: //JavaScript function bindNew(index) { var List = new Array(); List = showPage(index); var l...
代码如下: function pagerBar(dataCount,pageSize,serverUrl,contentPlace,pagerbarPlace,callBack){ this.dataCount = dataCount; this.pageSize = pageSize; this.serverUrl = serverUrl; this.contentPlace = $("#"+contentPlace); this.pagerbarPlace = $("#"+pagerbarPlace); this.callBack = callBack; this.pageCount = 0; this.pageIndex = 1; this.curInfo = $(""); this.prePage = $(""); this.nextPage = $(""); this.i...
本文实例讲述了基于jQuery实现的无刷新表格分页。分享给大家供大家参考,具体如下: 效果图如下:html结构:css样式:html,body{margin: 0;padding:0} a:focus {outline: none;} /* 通用表格显示 */ table, th, td {font: 12px Arial,Helvetica,sans-serif,宋体;margin: 0;padding: 0} table{border-spacing: 0;border-collapse: collapse;} .datatable {width: 100%;border-style: none;background-color: #fff;margin-bottom: 20...
本文实例讲述了jQuery实现伪分页的方法。分享给大家供大家参考,具体如下: 可以对表格数据进行伪分页,而且只需要执行简单的代码就可以实现。 实现的很简单、样式也不太好看,大家可以自行调整,纠正。 下面是一个table,tbody里加载tr数据,无论你怎么加载, 在数据加载完成后便可以对table数据进行伪分页、注意div引用的class,我填充的数据是四列的,所以td里加了colspan,div是分页显示区域下面是css和js方法.page_btn{padding-...
导航条 导航条(navbar)和上一节介绍的Bootstrap入门书籍之(四)菜单、按钮及导航。导航(nav),就相差一个字,多了一个“条”字。其实在Bootstrap框架中他们还是明显的区别。在导航条(navbar)中有一个背景色、而且导航条可以是纯链接(类似导航),也可以是表单,还有就是表单和导航一起结合等多种形式。它们在移动设备上可以折叠(并且可开可关),且在视口(viewport)宽度增加时逐渐变为水平展开模式。 基础导航条 实际上,...