当前位置: 代码迷 >> Web前端 >> 换行展示及分页
  详细解决方案

换行展示及分页

热度:333   发布时间:2012-10-17 10:25:47.0
换行显示及分页

<%@ page language="java" contentType="text/html; charset=UTF-8"

?? ?pageEncoding="UTF-8"%>

<%@page import="com.systop.core.dao.support.Page"%>

<html>

<%@include file="/common/meta.jsp" %>

<%@include file="/common/taglibs.jsp" %>

<head>

<title>网站首页</title>

<link href="${ctx}/ResRoot/css/public.css" rel="stylesheet" type="text/css" />

<link href="${ctx}/ResRoot/css/contribute_way.css" rel="stylesheet" type="text/css" />

<style type="text/css">

.goods{

float:left;?

width:170px;?

height:220px;?

margin:5px 5px;

}

.goods_img{

width:135px;?

height:145px;?

background-color:#F6F6F6;

border:1px solid #C0C0C0;

}

.goods_info{

margin-left:12px;

text-align: left;

}

img{

margin: auto auto;

}

.disEnable{

color: #C0C0C0;

}

</style>

</head>

<body>

<div style="width:970px;">

<div style="width:100%;margin-left:12px; border-bottom: 1px dotted #C0C0C0;">

?<s:iterator value="items" var="goods">

?<div class="goods">

? <table cellpadding="0" cellspacing="0"><tr>

? ?<td align="center" valign="middle" class="goods_img">

? <a href="view.do?model.id=${goods.id}" target="_blank">

? <img src="${ctx}${goods.smallMainImgPath}" onload="javascript:if(this.height>this.width){this.height=140}else{this.width=130}"/></a>

? ?</td>

? </tr></table>

<div class="goods_info"><a href="view.do?model.id=${goods.id}" target="_blank">${goods.name}</a></div>

<div class="goods_info">捐赠人:${goods.donor}</div>

<div class="goods_info">价 格:<span style="color:red">${goods.price}</span>

<span style="color: green;">¥</span></div>

<div class="goods_info">数 量:<span style="color:red">${goods.amount}</span></div>

?</div>

?</s:iterator>

</div>

<%

Page p = (Page)request.getAttribute("page");

%>

<div style="">

|&lt;&nbsp;<a href="goodsList.do?pageSize=<%=p.getPageSize()%>&ec_p=1">首页</a>&nbsp;&nbsp;

&lt;&lt;<% if (p.hasPreviousPage()){ %>

<a href="goodsList.do?pageSize=<%=p.getPageSize()%>&ec_p=<%=p.getPageNo()-1%>">上一页</a>

<%}else{ %>

<span class="disEnable">上一页</span>

<%} %>&nbsp;&nbsp;

<% if (p.getHasNextPage()){ %>

<a href="goodsList.do?pageSize=<%=p.getPageSize()%>&ec_p=<%=p.getPageNo()+1%>">下一页</a>

<%}else{ %>

<span class="disEnable">下一页</span>

<%} %>&gt;&gt; &nbsp;&nbsp;

<a href="goodsList.do?pageSize=<%=p.getPageSize()%>&ec_p=<%=p.getPages()%>">尾页</a>&nbsp;&gt;|&nbsp;&nbsp;

第<span style="color:red;"><%=p.getPageNo()%></span>页/共<span style="color:red;"><%=p.getPages()%></span>页&nbsp;&nbsp;

<input type="text" id="ec_p" name="ec_p" style="width:35px">

<input type="button" style="width:30px" value="GO" onclick="goPage()">

</div>

</div>

<script type="text/javascript">

function goPage(){

var pageNo = document.getElementById('ec_p').value;

var pNo = <%=p.getPages()%>;

if (!isNaN(pageNo)){

if(pNo < pageNo){

pageNo = pNo;

}

window.location.href = "goodsList.do?pageSize=<%=p.getPageSize()%>&ec_p=" + pageNo;

}else{

alert("请输入正确的数字!");

}

}

window.parent.scrollTo(0, 0);;

</script>

</body>

</html>

  相关解决方案