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

jquery layui分页控件在项目开发阶段经常用到，下面通过本文给大家介绍jQuery layui分页控件的使用，非常不错，对layui感兴趣的朋友一起看下吧

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

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

url是必选参数，表示json数据的地址；

data是可选参数，用于请求数据时发送数据参数；

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

//内容页面 <br>　　 
<p id="notice_p"></p><br>　　 //分页控件
<p id="notice_pages"></p>
<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 += " <p class='panel panel-default'>";
norice_content += " <p class='panel-heading'>";
norice_content += " <h3 class='panel-title'>";
norice_content += Row.CreateDate;
norice_content += " ";
norice_content += Row.Creater;
norice_content += " </h3>";
norice_content += " </p>";
norice_content += " <p class='panel-body'>";
norice_content += Row.NoticeContent;
norice_content += " </p>";
norice_content += " </p>";
});
$('#notice_p').html(norice_content);
//alert(11);
//调用分页
laypage({
cont: 'notice_pages',//容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<p id="page1"></p>
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分页控件的使用，希望对大家有所帮助！！

相关推荐：

详解layui.js如何实现表单验证功能

layui表格实现代码分享

layui选项卡效果实现代码分享

以上就是深入理解jQuery layui分页控件的使用的详细内容，更多请关注其它相关文章！