移動端分頁

1.微信掃描網站入口二維碼，進入移動端

2.點擊“加載更多”按鈕，實現移動端分頁功能，目的減少客戶等待時間以及節省流量（一次性加載全部數據，數據量大時會導致頁面等待時間過長和不必要的流量浪費）

3.原理流程：ajax將form表單數據以及當前頁面加1組裝為數組轉到后台，后台做分頁查詢，將結果組裝到jsonArray中再傳到前台，前台在ajax中用js代碼將傳來的數據也原來的列表頁面進行組裝，追加到原有列表后面。

4.核心代碼：

　　1> 加載更多按鈕和頁碼隱藏域　

<#if gTotalPageNumber != gCurrentPageNumber>
			<li class="more" onclick="moreAbility()">加載更多</li>
			<li class="noMore" style="display:none;">沒有更多</li>
			<#else>
			<li class="more" style="display:none;" onclick="moreAbility()">加載更多</li>
			<li class="noMore">沒有更多</li>
		</#if>
		<input type="hidden" id="gCurrentPageNumber" value="${gCurrentPageNumber}" />
		<input type="hidden" id="gTotalPageNumber" value="${gTotalPageNumber}" />

　　2> ajax 　　

 function moreAbility(){
        var gCurrentPageNumber = parseInt($("#gCurrentPageNumber").val()) + 1;
        var url = "${Context}/mobile/testing/moreInstitutions.action";
　　　　　//序列化form表單,得到的是組數對象
        var dataobj = $('#search').serialize();
　　　　 //拼接頁碼
        dataobj+="&gCurrentPageNumber="+ gCurrentPageNumber;
        var url = "${Context}/mobile/testing/moreAbility.action";
        $.ajax({
            url:url,
            async : false,
            type: "POST",
            data: dataobj,
            success: function(result) {
                var resultJson =  eval('('+result+')') ;
                var cuserList = resultJson.cuserList;
                for(var i = 0; i < cuserList.length; i++){
                    var divPDom = document.createElement("div");
                    divPDom.setAttribute("class","nengli_list");
                       
                    var divTitleDom = document.createElement("div");
                    divTitleDom.setAttribute("class","nengli_list_title");
                    divTitleDom.innerHTML = cuserList[i].unitName;
                    divPDom.appendChild(divTitleDom);
                    
                    
                    var divTextDom = document.createElement("div");
                    divTextDom.setAttribute("class","nengli_list_text content");
                    divTextDom.innerHTML = "檢測范圍:"+cuserList[i].detectionRange;
                    divPDom.appendChild(divTextDom);
                    
                    //加載到li標簽前面,li標簽是“加載更多“按鈕
                    $("li").eq(-2).before(divPDom);                 
                }  
                   $("#gCurrentPageNumber").val(resultJson.gCurrentPageNumber);
                $("#gTotalPageNumber").val(resultJson.gTotalPageNumber);
                if(resultJson.gCurrentPageNumber == resultJson.gTotalPageNumber){
                    $(".more").css("display","none");
                    $(".noMore").css("display","");
                }
            },
            error:function(XMLHttpRequest){
                alert("操作失敗,請重試！");
            }
        });
    }

 　　3> 組裝后台數據　

　　　　　//能力查詢 加載更多
	public String moreAbility() throws Exception{
　　　　　　　　　　//分頁數據查詢
		abilityQuery();
		JsonObject jsonObj = new JsonObject();
		jsonObj.addProperty("gCurrentPageNumber", super.gCurrentPageNumber);
		jsonObj.addProperty("gTotalPageNumber", super.gTotalPageNumber);
		JsonArray jsonArray = new JsonArray();
		for (int i = 0; i < cuserList.size(); i++) {
			JsonObject tempObj = new JsonObject();
			tempObj.addProperty("unitName", cuserList.get(i).getUnitName() == null ?"":cuserList.get(i).getUnitName());
			tempObj.addProperty("detectionRange", cuserList.get(i).getDetectionRange() == null ?"":cuserList.get(i).getDetectionRange());	
			jsonArray.add(tempObj);
		}
		jsonObj.add("cuserList", jsonArray);
		new Struts2Util().ResponsePrint(jsonObj.toString());
		return null;
	}