Heim > Web-Frontend > js-Tutorial > So verwenden Sie die jQuery-Laui-Paging-Steuerung

So verwenden Sie die jQuery-Laui-Paging-Steuerung

小云云
Freigeben: 2018-01-13 10:41:56
Original
1484 Leute haben es durchsucht

JQuery-Laui-Paging-Steuerung wird häufig in der Projektentwicklungsphase verwendet. Ich hoffe, dass es für Freunde interessant ist, die sich die Verwendung der JQuery-Laui-Paging-Steuerung ansehen allen helfen.

Einführung in die Verwendung von $.getJSON()


$.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )
Nach dem Login kopieren

URL ist ein erforderlicher Parameter, der die Adresse von JSON-Daten angibt;

data ist ein optionaler Parameter, der zum Senden von Datenparametern beim Anfordern von Daten verwendet wird;

success ist ein optionaler Parameter, bei dem es sich um eine Rückruffunktion handelt, die zum Verarbeiten der angeforderten Daten verwendet wird.


//内容页面 <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>
Nach dem Login kopieren
Verwandte Empfehlungen:


Layui-Paging-Effekt-Implementierungscode-Sharing

Detaillierte Erklärung des Unterschieds zwischen LayUI-Paging und LayUI-Laypage-Paging

LayUI implementiert die Front-End-Paging-Funktion

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die jQuery-Laui-Paging-Steuerung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage