bootstarp頁面分頁操作
在頁面上實現分頁操作，最主要的操作就是在前臺獲取到大量資料時，在使用JQuery進行遍歷操作時，首先需要把對進行分頁顯示的標籤進行移除處理，
防止在頁面分頁時出現累贅現象，具體操作方法為：現象
$("#ul").find("li").removed();//這樣就可以移除ul標籤下面的所以li標籤，防止在進行分頁操作時不清屏現象。
Jquery遍歷分頁操作程式碼為：
rowindex>=(pageNumber-1)*pagesize&&rowindex<=(pageNumber*pagesize-1)://這句話就可以實現分頁操作
具體程式碼如下所示：
//定義為全域性變數
var pageSize=6;//每頁顯示的數目
var pageNumber;//第幾頁
function pre() {
var page=pageNumber-1;
ExampaperInit(page);
}
function next() {
var page=pageNumber+1;
ExampaperInit(page);
}
function ExampaperInit(page){//初始化資料的顯示方法
pageNumber=page;
$("#zqcp_exampaper_tip").find("li").remove();//進行清屏處理
$.ajax({
url:'/qualtitytest/GetStudentZqcpExampaper',
type:"post",
success:function (data) {
if (data) {
$.each(data.StudentTestList,function (rowindex,rowvalue) {
if(rowindex>=(pageNumber-1)*pageSize&&rowindex<=(pageSize*pageNumber-1)) {//進行分頁處理
var examState;
var html;
if (rowvalue.p_flag == 1) {
examState = "正常";
}
else if (rowvalue.p_flag == 2) {
examState = "結束"
}
html = "<li style='margin-left: 55px'><div id=\"test_wall1\"><div id=\"test_name_label\"><label>" + rowvalue.p_name + "</label></div>" +
" <div id=\"start_block\"><div id=\"start_time_label\"><label>釋出時間：</label></div>" +
" <div id=\"start_time\"><label>" + rowvalue.createtime + "</label></div></div><div id=\"end_block\"><div id=\"end_time_label\">" +
" <label>試卷狀態：</label></div><div id=\"end_time\"><label>" + examState + "</label></div></div><div id=\"execution_block\">" +
"<div id=\"execution_label\"><label>完成情況：</label></div><div id=\"execution\"><label>未完成</label></div></div>" +
" <div id=\"btn_block\"><a href='/qualtitytest/answerhtml?id=" + rowvalue.id + "' class=\"btn btn-warning\">開始測試</a></div></div></li>";
$.each(data.StudentAnswerList, function (answerindex, answervalue) {
if (answervalue.exam_id == rowvalue.id) {
html = " <li style='margin-left: 55px'><div id=\"test_wall1\"><div id=\"test_name_label\"><label>" + rowvalue.p_name + "</label></div>" +
" <div id=\"start_block\"><div id=\"start_time_label\"><label>釋出時間：</label></div>" +
" <div id=\"start_time\"><label>" + rowvalue.createtime + "</label></div></div><div id=\"end_block\"><div id=\"end_time_label\">" +
" <label>試卷狀態：</label></div><div id=\"end_time\"><label>" + examState + "</label></div></div><div id=\"execution_block\">" +
"<div id=\"execution_label\"><label>完成情況：</label></div><div id=\"execution\"><label>已完成</label></div></div>" +
" <div id=\"btn_block\"><span style='font-size: 20px;color: red;font-weight: bold;padding: 5px'>測試得分：" + answervalue.test_score + "</span></div></div></li>";
}
});
$('#zqcp_exampaper_tip').append(html);
}
})
}
},
error:function () {
alert("出錯了，請聯絡管理員！");
}
})
}
$(function () {
ExampaperInit(1);//頁面載入完呼叫初始化試卷方法取值。
});
這樣的話bootstarp分頁欄目就可以通過呼叫初始化函式，填入相關的頁數實現分頁操作功能。