jquery ajax自定义分页组件(jquery.loehpagerv1.0)原创

简单的两个步骤即可实现分页功能

 <script src="<%=basePath%>/resources/js/jquery-1.7.1.min.js"></script>
 <script src="<%=basePath%>/resources/js/jquery.loehpagerv1.0.js"></script>
 <script type="text/JavaScript">
//回调里面进行业务处理
 function loehpagercallback(data) {

      alert(‘这里处理回调的data‘);

     }

 $(function() {
 $(‘#customerPager‘).LoehPagerPlugin({
        ‘color‘: ‘gray‘,
        ‘fontSize‘: ‘15px‘,
        ‘totalCount‘:<%=totalpage%>,
         ‘pageSize‘:‘15‘,
         ‘ajaxCallBack‘:‘loehpagercallback‘,
         ‘ajaxRequestParameter‘:‘name=leohpager&age=10‘,
         ‘ajaxOriginalParameter‘:‘name=leohpager&age=10‘,
         ‘ajaxUrl‘:‘<%=basePath%>/ipload?path=data‘

    });

 });

 </script>
  <html>
     <body>
      <div  id="customerPager" style="position: relative;top: -25px;left: 220px;" >  </div>

     </body>
  </html>

totalCount‘:<%=totalpage%>:总页是第一次加载页面时查询出的分页表的总页数。

‘ajaxCallBack‘:‘loehpagercallback‘:这里设置回调方法,你可以将方法名修改任意你在调用页定义的js方法

‘ajaxRequestParameter‘:‘name=leohpager&age=10‘:

‘ajaxOriginalParameter‘:‘name=leohpager&age=10‘,

上面两个参数,第一个是ajax请求数据时的参数,它是由第二个参数拼接上当前选择的页面组合而成。

版本1.0,简单的几句代码既可以实现分页功能,后续有时间会继续更新。

下载地址:http://download.csdn.net/detail/liaohang1987x/9829665

官方交流群:636620079

时间: 2024-10-19 01:38:31

jquery ajax自定义分页组件(jquery.loehpagerv1.0)原创的相关文章

extjs_09_自定义分页组件

1.项目截图 2.CustomSizePagingToolbar.js Ext.define("Ext.ux.CustomSizePagingToolbar", {// 定义的名字要和文件的名字大小写一样 extend : "Ext.toolbar.Paging", alias : "widget.custompaging",// 别名 beforSizeText : "每页", afterSizeText : "条

vue自定义分页组件---切图网

vue2.5自定义分页组件 Pagination.vue,可设置每页显示条数,带跳转框直接跳转到相应页面,亲测有用.目前很多框架自带有分页组件比如elementUI,不过在面对一个拿到PSD稿,然后重新切图,重新VUE开发的项目来说,自定义分页组件才是应万变的最佳打开方式. html <template> <div class="pagination" v-if="totalPage>1"> <span v-if="!s

Angular4.+ ngx-bootstrap Pagination 自定义分页组件

Angular4 随笔(二)  --自定义分页组件 1.简介 本组件主要是实现了分页组件显示功能,通过使用 ngx-bootstrap Pagination分页组件实现. 基本逻辑: 1.创建一个分页组件,如:ng g component  pager 2.父组件调用子组件,并向子组件传入基础配置信息 3.分页组件接收父组件传参,并在模板上进行配置,在html模板上定义点击事件,调用分页子组件自身一个方法 4.分页组件定义发射器,当页码发生变化时,发射通知 5.父组件模板调用分页组件处,监听分页

jQuery ajax 实现分页 kkpager插件

代码片段一: <!--分页组件 JS CSS 开始--> <!--分页组件 CSS--> <link type="text/css" href="/resource/css/kkpager_blue.css" rel="stylesheet" /> <!--分页组件 JS--> <script type="text/javascript" src="/resour

PHP中使用jQuery+Ajax实现分页查询多功能操作

1.首先做主页面Ajax_pag.php 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ajax做分页</title> <script src="bootstrap/js/jquery-1.11.2.min.js"></script> <script src="Ajax_

Jquery Ajax 操作函数跟JQuery 遍历函数跟JQuery数据操作函数

JQuery文档操作方法 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数                                   描述 jQuery.ajax()                 执行异步 HTTP (Ajax) 请求. .ajaxComplete()            当 Ajax 请求完成时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxError()             

DJANGO 自定义分页组件

第一次在码云上面分享代码片段,记录一下: https://gitee.com/trunkslisa/codes/14gkxi3zf9e2ulbvjnqyo90 class Pagination(object): def __init__(self, totalCount, currentPage, perPageNum=20, maxPageNum=7): # 传入: # -所有数据的个数 totalCount self.totalCount = totalCount # -当前页 curren

Jquery Ajax 跨域调用asmx类型 WebService范例

摘要:Ajax 在 Web 2.0 时代起着非常重要的作用,然而有时因为同源策略(SOP)(俗称:跨域问题(cross domain)) 它的作用会受到限制.在本文中,将学习如何克服合作限制.本文以asmx方式搭建webservice作为测试用后端,给出完整的前后端调用解决方案.范例代码. 关键词: jquery ajax 跨域  webservice  asmx  cross-domain 0 问题分析 0.1 什么是跨域问题? 越来越多的网站需要相互协作.例如,在线房屋租赁网站需要谷歌地图的

jquery ajax跨域的完美解决方法(jsonp方式)

ajax跨域请求的问题,JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式,接下来为大家详细介绍下客户端JQuery.ajax的调用代码 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发 JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式.分别是JQuery的 jquery.ajax jsonp格式和jquer