深入理解jQuery layui分页控件的使用


Posted in Javascript onAugust 17, 2016

$.getJSON( )的使用方法简介

$.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )

url是必选参数,表示json数据的地址;

data是可选参数,用于请求数据时发送数据参数;

success是可参数,这是一个回调函数,用于处理请求到的数据。

//内容页面 <br> 
<div id="notice_div"></div><br>
 //分页控件
<div id="notice_pages"></div>
<script>
var roolurl = "http://" + window.location.host;
var urlAshx = roolurl + "/aa/Ashx/NoticeInfo.ashx";
//var pages = 0;
//获取分页好的公告内容
function GetNoticeList(curr, cid) {
$.getJSON(urlAshx,
{//参数
action: "notice_action",
courseid: cid,
page: curr || 1,//向服务端传的参数,此处只是演示
nums: 3//每页显示的条数
}, function (datajson) {//成功执行的方法
if (datajson != null) {
var norice_content = "";
//alert(datajson.pages);
$(datajson.rows).each(function (n, Row) {
norice_content += " <div class='panel panel-default'>";
norice_content += " <div class='panel-heading'>";
norice_content += " <h3 class='panel-title'>";
norice_content += Row.CreateDate;
norice_content += " ";
norice_content += Row.Creater;
norice_content += " </h3>";
norice_content += " </div>";
norice_content += " <div class='panel-body'>";
norice_content += Row.NoticeContent;
norice_content += " </div>";
norice_content += " </div>";
});
$('#notice_div').html(norice_content);
//alert(11);
//调用分页
laypage({
cont: 'notice_pages',//容器。值支持id名、原生dom对象,jquery对象。【如该容器为】:<div id="page1"></div>
pages: datajson.pages,//总页数
groups: 5, //连续显示分页数
skip: false, //是否开启跳页
skin: '#AF0000',
curr: curr || 1, //当前页,
jump: function (obj, first) {//触发分页后的回调
if (!first) {//点击跳页触发函数自身,并传递当前页:obj.curr
GetNoticeList(obj.curr, cid);
}
}
})
}
});
}
$(document).ready(function () {
GetNoticeList(0, '<%=_courseid%>')
});
</script>

以上所述是小编给大家介绍的jQuery layui分页控件的使用,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
模拟用户操作Input元素,不会触发相应事件
May 11 Javascript
Javascript学习笔记4 Eval函数
Jan 11 Javascript
SOSO地图JS画出标注和中心点以html形式运行
Aug 09 Javascript
JavaScript图片放大技术(放大镜)实现代码分享
Nov 14 Javascript
js判断文本框剩余可输入字数的方法
Feb 04 Javascript
js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)
Mar 09 Javascript
Highcharts学习之坐标轴
Aug 02 Javascript
JavaScript SHA-256加密算法详细代码
Oct 06 Javascript
基于jQuery实现的Ajax 验证用户名唯一性实例代码
Jun 28 jQuery
promise和co搭配生成器函数方式解决js代码异步流程的比较
May 25 Javascript
微信小程序定位当前城市的方法
Jul 19 Javascript
如何优化vue打包文件过大
Apr 13 Vue.js
AngularJS 作用域详解及示例代码
Aug 17 #Javascript
jQuery Easyui使用(一)之可折叠面板的布局手风琴菜单
Aug 17 #Javascript
jQuery Easyui使用(二)之可折叠面板动态加载无效果的解决方法
Aug 17 #Javascript
js实现添加可信站点、修改activex安全设置,禁用弹出窗口阻止程序
Aug 17 #Javascript
Node.js中使用jQuery的做法
Aug 17 #Javascript
学习Angular中作用域需要注意的坑
Aug 17 #Javascript
js enter键激发事件实例代码
Aug 17 #Javascript
You might like
把PHP安装为Apache DSO
2006/10/09 PHP
菜鸟学PHP之Smarty入门
2007/01/04 PHP
php 如何获取文件的后缀名
2016/06/05 PHP
Yii2实现上下联动下拉框功能的方法
2016/08/10 PHP
PHP快速推送微信模板消息
2017/04/14 PHP
php使用 readfile() 函数设置文件大小大小的方法
2017/08/11 PHP
PHP实现求连续子数组最大和问题2种解决方法
2017/12/26 PHP
PHP中引用类型和值类型功能与用法示例
2019/02/26 PHP
JS 用6N±1法求素数 实例教程
2009/10/20 Javascript
JavaScript 学习笔记(十六) js事件
2010/02/01 Javascript
JavaScript中的cacheStorage使用详解
2015/07/29 Javascript
深入探讨javascript函数式编程
2015/10/11 Javascript
JS区分浏览器页面是刷新还是关闭
2016/04/17 Javascript
详解angularJs模块ui-router之状态嵌套和视图嵌套
2017/04/28 Javascript
redux中间件之redux-thunk的具体使用
2018/04/17 Javascript
解决layui前端框架 form表单,table表等内置控件不显示的问题
2018/08/19 Javascript
layer.open的自适应及居中及子页面标题的修改方法
2019/09/05 Javascript
mpvue网易云短信接口实现小程序短信登录的示例代码
2020/04/03 Javascript
零基础写python爬虫之抓取百度贴吧并存储到本地txt文件改进版
2014/11/06 Python
详解python中字典的循环遍历的两种方式
2017/02/07 Python
Sanic框架蓝图用法实例分析
2018/07/17 Python
python 获取图片分辨率的方法
2019/01/08 Python
解决python文件双击运行秒退的问题
2019/06/24 Python
不到20行实现Python代码即可制作精美证件照
2020/04/24 Python
Python中SQLite如何使用
2020/05/27 Python
在css3中background-clip属性与background-origin属性的用法介绍
2012/11/13 HTML / CSS
单位领导证婚词
2014/01/14 职场文书
创先争优活动党员公开承诺书
2014/08/29 职场文书
四风问题个人剖析材料
2014/10/07 职场文书
单位收入证明范本
2015/06/18 职场文书
新人入职感言
2015/07/31 职场文书
2016秋季校长开学典礼致辞
2015/11/26 职场文书
浅谈Redis主从复制以及主从复制原理
2021/05/29 Redis
Spring中bean的生命周期之getSingleton方法
2021/06/30 Java/Android
nginx配置虚拟主机的详细步骤
2021/07/21 Servers
一篇文章搞懂python混乱的切换操作与优雅的推导式
2021/08/23 Python