寫程式碼參考了這位大神的部落格。下面貼上我的程式碼。

首先是要把引入的分頁js和css新增進來。這個程式碼自己百度吧。

$.ajax({
					type:'post',
					url:'url',
					data:{
						modelName:orderidf,
					},
					dataType:'json',
					success:function(result){
						if(result.state == 0){
							var dataObj = eval("("+result.brandArray+")");
							var html ="";
							for(var i= 0;i<dataObj.length;i++){
								var brand = dataObj[i];
								html+="<tr>";
								html+="<td>"+brand.seriesName+"</td>";
								html+="<td>"+brand.gears+"</td>";
								html+="<td>"+brand.displacement+"</td>";
								html+="<td>"+brand.configurationModel+"</td>";
								html+="<td>"+brand.priceReference+"萬</td>";
								html+="<td><input type='button' id='brandModelID' value='確定選擇' onclick='choiceBrand("+brand.brandModelID+',"'+brand.configurationModel+"")'></td>";
								html+="</tr>";
							}
							layer.open({
								type: 1,
					                        shade: false,
					                        title:'車型選擇',
						  		area: ['800px','400px'], //寬高 
								content: $('#Models_selection_style'),
							});
							$("#tb").html(html);
							 $(".tcdPageCode").createPage({
							       pageCount:parseInt(result.totalNum),
							       current:parseInt(result.pageNum),
							       backFn:function(p){
							       			$.ajax({
												type:'post',
												url:'url',
												data:{
													modelName:orderidf,
													pageNum:p
												},
												dataType:'json',
												success:function(result){
													if(result.state == 0){
														var dataObj = eval("("+result.brandArray+")");
														var html ="";
														for(var i= 0;i<dataObj.length;i++){
															var brand = dataObj[i];
															html+="<tr>";
															html+="<td>"+brand.seriesName+"</td>";
															html+="<td>"+brand.gears+"</td>";
															html+="<td>"+brand.displacement+"</td>";
															html+="<td>"+brand.configurationModel+"</td>";
															html+="<td>"+brand.priceReference+"萬</td>";
															html+="<td><input type='button' id='brandModelID' value='確定選擇' onclick='choiceBrand("+brand.brandModelID+',"'+brand.configurationModel+"")'></td>";
															html+="</tr>";
														}
														layer.open({
															type: 1,
												            shade: false,
												            title:'車型選擇',
															area: ['800px','400px'], //寬高 
															content: $('#Models_selection_style'),
														});
														$("#tb").html(html);
														}
							      	 			}
							 		 	 });
							   		}
							   	});
						}else if(result.reLogin == 0) {
			                window.location.href = basePath + '/site/UserAction/toLogin.do';
			            }else{
			            	layer.alert(result.errerMsg,{
						    	  	 title: '提示框',				
								  	 icon:0							
							});
			            }
					}
				});
 

前臺jsp頁面

<div class="Models_selection_style none" id="Models_selection_style">
				<div class="Models_content">
					<table cellpadding="0" cellspacing="0" width="100%" id="table">
						<thead>
							<tr class="title_name">
								<th>
									車系
								</th>
								<th>
									檔位
								</th>
								<th>
									排量
								</th>
								<th>
									產品型號
								</th>
								<th>
									參考價
								</th>
								<th>
									車型選擇
								</th>
							</tr>
						</thead>
						<tbody id="tb">
						</tbody>
					</table>
					<!-- 分頁 -->
					<div class="tcdPageCode" ></div>
					<div class="notice_style">
						<p>
							如你的車輛不再選擇範圍之內,請致電
							<b>400-234-1234</b>
						</p>
					</div>
				</div>
			</div>
 

我做的是一個彈出框。後臺返回的json陣列字串，在前臺通過拼接的方式，for迴圈遍歷這個陣列，彈出框下面實現的分頁。

效果圖。

本人新手，只是把自己工作中所實現的一些功能整理出來，有不足之處還請見諒