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

前端技术 2023/09/01 JavaScript

$.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分页控件的使用,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对phpstudy网站的支持!

本文地址:https://www.stayed.cn/item/1412

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。