Comment utiliser le contrôle de pagination jQuery layui

Le contrôle de pagination jquery layui est souvent utilisé dans la phase de développement du projet. Cet article vous présentera l'utilisation du contrôle de pagination jQuery layui. Les amis intéressés devraient y jeter un œil. aider tout le monde.

Introduction à l'utilisation de $.getJSON()

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

url est un paramètre obligatoire, indiquant l'adresse des données json

data est un paramètre facultatif, utilisé pour envoyer des paramètres de données lors de la demande de données ;

success est un paramètre facultatif, qui est une fonction de rappel utilisée pour traiter les données demandées.

//内容页面 <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=&#39;panel panel-default&#39;>";
norice_content += " <p class=&#39;panel-heading&#39;>";
norice_content += " <h3 class=&#39;panel-title&#39;>";
norice_content += Row.CreateDate;
norice_content += " ";
norice_content += Row.Creater;
norice_content += " </h3>";
norice_content += " </p>";
norice_content += " <p class=&#39;panel-body&#39;>";
norice_content += Row.NoticeContent;
norice_content += " </p>";
norice_content += " </p>";
});
$(&#39;#notice_p&#39;).html(norice_content);
//alert(11);
//调用分页
laypage({
cont: &#39;notice_pages&#39;,//容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<p id="page1"></p>
pages: datajson.pages,//总页数
groups: 5, //连续显示分页数
skip: false, //是否开启跳页
skin: &#39;#AF0000&#39;,
curr: curr || 1, //当前页,
jump: function (obj, first) {//触发分页后的回调
if (!first) {//点击跳页触发函数自身，并传递当前页：obj.curr
GetNoticeList(obj.curr, cid);
}
}
})
}
});
}
$(document).ready(function () {
GetNoticeList(0, &#39;<%=_courseid%>&#39;)
});
</script>

Recommandations associées :

Partage de code de mise en œuvre de l'effet de pagination Laui

Explication détaillée de la différence entre la pagination LayUI et la pagination LayUI laypage

LayUI implémente la fonction de pagination frontale

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!