jquery.pagination 分页插件使用代码

jquery.pagination 分页插件

下载链接

http://www.jq22.com/yanshi5697

js代码内容

       var listLength = '' var pageNum = 1var data = {parameter: "{\"PageSize\":12,\"PageIndex\":0}",cMethodName: "GetNews"}//第一步：先获取一次数据，然后根据数据渲染页面和分页按钮$.ajax({url: "http://139.196.121.139:7010/Default/WebSiteAPI",type: "post",data:data,dataType: "json",success: function(data) {var list = data.Status_Data.datalistLength = data.Status_Data.recordCountvar pageNum = Math.ceil(listLength / 12); //总页数=总条数/每页显示数//设置分页按钮$('.Pagination').pagination({pageCount:pageNum,//页数prevContent:"<",//上一页显示内容nextContent:">",//下一页显示内容count:2,//左右两边显示几个按钮showData:2,//每页显示条数keepShowPN:true, //是否一直显示上一页下一页callback: function (api) { //页面点击时回调函数var data = {parameter: "{\"PageSize\":12,\"PageIndex\":"+(api.getCurrent()-1)+"}", //通过当前页来调ajaxcMethodName: "GetNews"}$.ajax({url: "http://139.196.121.139:7010/Default/WebSiteAPI",type: "post",data:data,dataType: "json",success: function(data) {var list = data.Status_Data.data//拿到数据后渲染DOMvar contentUse = ''list.map(e=>{var date = e.dInputDate.slice(5,10)contentUse +=  `<div class="each_news_box"><a href="news_inner.html?${e.ID}" title=""><h3>${e.Title}</h3><span>${date}</span><p>${e.Brief}</p></a></div>`})//放入dom$('.newsMain_body').html(contentUse)}})}});//根据获取到的data先渲染一次页面内容var contentUse = ''list.map(e=>{var date = e.dInputDate.slice(5,10)contentUse +=  `<div class="each_news_box"><a href="news_inner.html?${e.ID}"  title=""><h3>${e.Title}</h3><span>${date}</span><p>${e.Brief}</p></a></div>`})$('.newsMain_body').html(contentUse)}})

jquery.pagination 分页插件使用代码相关推荐

[JQuery]pagination分页插件不显示
由于不熟悉项目中使用到的pagination分页插件,在调试时发现分页插件不显示.开始以为是js.css文件有问题,排除后又检查使用方法.在其他方法尝试无果,准备更换插件时发现问题所在. 一.常见情况 ...
jQuery Pagination分页插件--无刷新
源码:https://github.com/SeaLee02/FunctionModule/blob/master/UploadFiles/WebDemo/FenYE/FenYeAjax.aspx 代 ...
jQuery Pagination分页插件
demo实例页面基本demo页面 Ajax demo页面参数可编辑demo页面插件简介此jQuery插件为Ajax分页插件,一次性加载,故分页切换时无刷新与延迟,如果数据量较大不建议用此方法, ...
jQuery Pagination分页插件的使用
一.引用CSS和JS: <link href="/Content/Plugins/jQuery.Pagination_v2.2/pagination.css" rel=&qu ...
Jquery前端分页插件pagination同步加载和异步加载
上一篇文章介绍了Jquery前端分页插件pagination的基本使用方法和使用案例,大致原理就是一次性加载所有的数据再分页.https://www.jianshu.com/p/a1b8b1db025 ...
java ajax jquery分页插件_jQuery ajax分页插件实例代码
既然说到基于jQuery的ajax分页插件,那我们就先看看主要的代码结构:(我觉得对咱们程序员来说再优美的文字描述.介绍也比不上代码来得实在.) 1.首先定义一个pager对象: var sjPag ...
java ajax jquery分页插件_分享精心挑选的12款优秀jQuery Ajax分页插件和教程
摘要:这篇jQuery栏目下的"分享精心挑选的12款优秀jQuery Ajax分页插件和教程",介绍的技术点是"jquery_ajax分页插件.jquery_ajax.a ...
Jquery自定义分页插件
效果: 核心代码: 自定义Jquery插件grid.js //Jquery自定义分页插件 (function($) {$.fn.grid= function(options) {var objGrid ...
Jquery的分页插件
Jquery的分页插件, 用起来还不错. 来自: http://flaviusmatis.github.io/simplePagination.js/ 下载地址: https://github.com ...

jquery.pagination 分页插件使用代码

http://www.jq22.com/yanshi5697

js代码内容

jquery.pagination 分页插件使用代码相关推荐

最新文章

热门文章