深入理解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 相关文章推荐
List the Stored Procedures in a SQL Server database
Jun 20 Javascript
理解Javascript_09_Function与Object
Oct 16 Javascript
jQuery学习笔记(4)--Jquery中获取table中某列值的具体思路
Apr 10 Javascript
详细分析使用AngularJS编程中提交表单的方式
Jun 19 Javascript
javascript实现网站加入收藏功能
Dec 16 Javascript
基于Bootstrap3表格插件和分页插件实例详解
May 17 Javascript
JavaScript实现通过select标签跳转网页的方法
Sep 29 Javascript
MUI 上拉刷新/下拉加载功能实例代码
Apr 13 Javascript
用vue的双向绑定简单实现一个todo-list的示例代码
Aug 03 Javascript
jQuery实现模糊搜索功能的方法分析
Jun 29 jQuery
react中实现搜索结果中关键词高亮显示
Jul 31 Javascript
原生js实现拖拽移动与缩放效果
Aug 24 Javascript
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 array_search() 函数使用
2010/04/13 PHP
PHP抽象类基本用法示例
2018/12/28 PHP
跨浏览器开发经验总结(三)   警惕“IE依赖综合症”
2010/05/13 Javascript
javascript 异步页面查询实现代码(asp.net)
2010/05/26 Javascript
Jsonp 跨域的原理以及Jquery的解决方案
2011/06/27 Javascript
jquery.autocomplete修改实现键盘上下键自动填充示例
2013/11/19 Javascript
JS动态添加与删除select中的Option对象(示例代码)
2013/12/20 Javascript
删除Javascript Object中间的key
2014/11/18 Javascript
Javascript 完美运动框架(逐行分析代码,让你轻松了运动的原理)
2015/01/23 Javascript
javascript制作网页图片上实现下雨效果
2015/02/26 Javascript
jQuery实现定时读取分析xml文件的方法
2015/07/16 Javascript
JS中生成随机数的用法及相关函数
2016/01/09 Javascript
js计算时间差代码【包括计算,天,时,分,秒】
2016/04/26 Javascript
node-http-proxy修改响应结果实例代码
2016/06/06 Javascript
Bootstrap CSS组件之按钮组(btn-group)
2016/12/17 Javascript
swiper 解决动态加载数据滑动失效的问题
2018/02/26 Javascript
详解js跨域请求的两种方式,支持post请求
2018/05/05 Javascript
Vuejs学习笔记之使用指令v-model完成表单的数据双向绑定
2019/04/29 Javascript
python strip()函数 介绍
2013/05/24 Python
详解Python的Django框架中Manager方法的使用
2015/07/21 Python
Python 中开发pattern的string模板(template) 实例详解
2017/04/01 Python
最近Python有点火? 给你7个学习它的理由!
2017/06/26 Python
解决django-xadmin列表页filter关联对象搜索问题
2019/11/15 Python
python框架flask入门之路由及简单实现方法
2020/06/07 Python
巧用HTML5给按钮背景设计不同的动画简单实例
2016/08/09 HTML / CSS
应用艺术毕业生的自我评价
2013/12/04 职场文书
大一新生军训时的自我评价分享
2013/12/05 职场文书
2014年中班元旦活动方案
2014/02/14 职场文书
抄作业检讨书
2014/02/17 职场文书
出纳员岗位职责风险
2014/03/06 职场文书
英文升职感谢信
2015/01/23 职场文书
2015年社区宣传工作总结
2015/05/20 职场文书
基于Python绘制子图及子图刻度的变换等的问题
2021/05/23 Python
详解Laravel框架的依赖注入功能
2021/05/27 PHP
Spring mvc是如何实现与数据库的前后端的连接操作的?
2021/06/30 Java/Android
使用 Apache 反向代理的设置技巧
2022/01/18 Servers