jqueryページページング(フロントバックグラウンド)

3301 ワード

効果:トップページ1 2 3 4 5 6 7
くだらないことはあまりコードを言わない
html:



jquery:
//   begin
			var size=7; //    n     
			val="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do'>  </a></font>";
			if(data.totalPage<=size) //      
			{
				for(var i=1;i<=data.totalPage;i++)
				{
					if(page==i)
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'><font color='red'>"+i+"</font></a></font>";
					else
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'>"+i+"</a></font>";
				}
			}else if(page<=Math.floor(size/2))  //     1/2  
			{
				for(var i=1;i<=size;i++)
				{
					if(page==i)
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'><font color='red'>"+i+"</font></a></font>";
					else
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'>"+i+"</a></font>";
				}
			}else if(data.totalPage-page<=Math.floor(size/2))  //    1/2  
			{
				for(var i=data.totalPage-size;i<=data.totalPage;i++)
				{
					if(page==i)
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'><font color='red'>"+i+"</font></a></font>";
					else	
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'>"+i+"</a></font>";
				}
			}else //      
			{
				for(var i=page-Math.floor(size/2);i<=page+Math.floor(size/2);i++)
				{
					if(page==i)
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'><font color='red'>"+i+"</font></a></font>";
					else	
						val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+i+"&novelTypeId="+typeid+"'>"+i+"</a></font>";
				}	
			}
			val+="<font class='top_09'><a href='${pageContext.request.contextPath}/novel/novelType.do?page="+data.totalPage+"&novelTypeId="+typeid+"'>  </a></font>";
			$("#pageDown").html(val);
			$("#pageTop").html(val);