需求:
有一批企业的基本信息需要展示出来,要求一级页以列表形式展示企业清单,点击公司名称后进入二级页面,二级页面展示企业简介和几张图片。
实现效果:
开发环境:
Win7,Eclipse,Mysql
数据库表设计:
cpid | 主键 |
cpname | 公司名称 |
cpbody | 公司简介 |
cpimg1 | 图片1路径 |
cpimg2 | 图片2路径 |
cpimg3 | 图片3路径 |
cpimg4 | 图片4路径 |
展示公司列表代码company.jsp
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@page import="java.sql.*"%> 2 <%@ page language="java" contentType="text/html; 3 charset=UTF-8" 4 pageEncoding="UTF-8" info="this is the company platform index page"%> 5 6 <!doctype html> 7 <html> 8 <head> 9 <meta charset="utf-8"> 10 <title>company</title> 11 12 <style> 13 body { 14 margin: 0 auto; 15 } 16 17 h1 { 18 margin: 0 auto; 19 line-height: 100px; 20 text-align: center; 21 color: #FFFFFF; 22 font-family: 微软雅黑; 23 } 24 25 .container { 26 width: 1000px; 27 margin: 0 auto; 28 background: none; 29 height: 1000px; 30 } 31 32 .cphead { 33 width: 1000px; 34 height: 100px; 35 background-color: #B40F0B; 36 margin: 0 auto; 37 } 38 39 .cpintro { 40 width: 1000px; 41 height: 15px; 42 margin: 0 auto; 43 line-height: 15px; 44 color: #B4120F; 45 } 46 47 .cplist { 48 width: 1000px; 49 margin: 0 auto; 50 height: 600px; 51 } 52 53 .cplist table { 54 width: 100%; 55 } 56 57 .cplist td { 58 height: 45px; 59 font-family: 微软雅黑; 60 font-size: 18px; 61 line-height: 40px; 62 } 63 64 .cptdleft { 65 width: 3%; 66 } 67 68 .cptdmiddle { 69 width: 85%; 70 } 71 72 .cptdright { 73 text-align: center; 74 } 75 76 .cplist a { 77 text-decoration: none; 78 color: #000000; 79 } 80 81 .cplist a:hover { 82 text-decoration: underline; 83 color: #F10A0E; 84 } 85 86 .bluefont { 87 color: blue; 88 font-style: bold; 89 } 90 91 .bluefont a { 92 text-decoration: underline; 93 color: blue; 94 } 95 </style> 96 97 </head> 98 99 <body> 100 <jsp:include page="cphead.jsp"></jsp:include> 101 <div class="container"> 102 <div class="cplist" id="cplistheight"> 103 <table> 104 <% 105 try { 106 //注册数据驱动 107 Class.forName("com.mysql.jdbc.Driver"); 108 //获取数据库连接 109 Connection conn = DriverManager.getConnection( 110 "jdbc:mysql://localhost:3306/db_gongxiang", "root", 111 "123456"); 112 //创建statement 113 Statement stmt = conn.createStatement(); 114 //执行查询 115 116 ResultSet rs = stmt.executeQuery("select * from tb_company"); 117 118 int intPageSize; //一页显示的记录数 119 int intRowCount; //记录的总数 120 int intPageCount; //总页数 121 int intPage; //待显示的页码 122 String strPage; 123 int i; 124 //设置一页显示的记录数 125 intPageSize = 10; 126 //取得待显示的页码 127 strPage = request.getParameter("page"); 128 //判断strPage是否等于null,如果是,显示第一页数据 129 if (strPage == null) { 130 intPage = 1; 131 } else { 132 //将字符串转换为整型 133 intPage = java.lang.Integer.parseInt(strPage); 134 } 135 if (intPage < 1) { 136 intPage = 1; 137 } 138 //获取记录总数 139 rs.last(); 140 intRowCount = rs.getRow(); 141 //计算机总页数 142 intPageCount = (intRowCount + intPageSize - 1) / intPageSize; 143 //调整待显示的页码 144 if (intPage > intPageCount) 145 intPage = intPageCount; 146 if (intPageCount > 0) { 147 //将记录指针定位到待显示页的第一条记录上 148 rs.absolute((intPage - 1) * intPageSize + 1); 149 } 150 //下面用于显示数据 151 i = 0; 152 while (i < intPageSize && !rs.isAfterLast()) { 153 %> 154 155 <tr> 156 <td class="cptdleft"><img src="images/14.jpg"></td> 157 <td class="cptdmiddle"><a 158 href="cp1.jsp?cpid=<%=rs.getString(1)%>" target="_blank"><%=rs.getString(2)%></a></td> 159 <td class="cptdright">2015-06-20</td> 160 161 </tr> 162 <% 163 rs.next(); 164 i++; 165 } 166 //关闭连接、释放资源 167 rs.close(); 168 stmt.close(); 169 conn.close(); 170 %> 171 <tr> 172 <td colspan="2" align="center">共<span class="bluefont"><%=intRowCount%></span>个记录,分<span 173 class="bluefont"><%=intPageCount%></span>页显示,当前页是:第<span 174 class="bluefont"><%=intPage%></span>页 <span class="bluefont"> 175 <% 176 for (int j = 1; j <= intPageCount; j++) { 177 out.print(" <a href='company.jsp?page=" + j 178 + "'>" + j + "</a>"); 179 } 180 %> 181 </span> 182 183 <% 184 } catch (Exception e) { 185 e.printStackTrace(); 186 } 187 %> 188 </td> 189 </tr> 190 191 </table> 192 193 </div> 194 195 <jsp:include page="footer.jsp"></jsp:include> 196 </div> 197 </body> 198 </html>
公司详情页代码cp1.jsp
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
<%@page import="java.sql.*"%> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% // out.println( request.getParameter("cpid")); String aa= request.getParameter("cpid"); //注册数据驱动 Class.forName("com.mysql.jdbc.Driver"); //获取数据库连接 Connection conn = DriverManager.getConnection( "jdbc:mysql://localhost:3306/db_gongxiang", "root", "123456"); //创建statement Statement stmt = conn.createStatement(); //执行查询 ResultSet rs = stmt .executeQuery("select * from tb_company where cpid="+aa); %> <% while (rs.next()) { %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title><%=rs.getString(2)%></title> <!-- <script language="Javascript"> document.oncontextmenu=new Function("event.returnValue=false"); //禁止右键 document.onselectstart=new Function("event.returnValue=false"); //禁止复制文字 </script> --> <style> body { margin: 0 auto; } h1 { margin: 0 auto; line-height: 100px; text-align: center; color: #FFFFFF; font-family: 微软雅黑; } .cpname { margin: 0 auto; text-align: center; color: #B4120F; } .container { width: 980px; margin: 0 auto; background: none; } .cphead { width: 980px; height: 100px; background-color: #B40F0B; margin: 0 auto; } .cpintro { width: 980px; height: 15px; margin: 0 auto; line-height: 15px; color: #B4120F; } .cpdetail { width: 980px; margin: 0 auto; height: auto; } .cpdetailtop { width: 90%; font-size:18px; margin: 0 auto; font-size: 18px; line-height: 32px; font-family: 微软雅黑; } .cpimg { height:auto; } </style> </head> <body> <div class="container"> <div class="cphead"> <h1>全国居民主食加工企业展示平台</h1> </div> <div class="cpintro"> <h3> <img src="images/16.jpg"> 全国居民主食加工企业 </h3> </div> <hr width="980px" color="#B40F0B"> <div class="cpdetail"> <!--公司详情开始--> <h3>公司简介</h3> <div class="cpdetailtop"> <!-- 上部div文字介绍--> <h3 class="cpname"><%=rs.getString(2)%></h3> <p> <%=rs.getString(3)%></p> </div> <div class="cpimg"> <!--下部div图片滚动效果--> <h3>公司形象</h3> <table align="center"> <tr> <td><img src="<%=rs.getString(4)%>" width="220px" height="150px" alt="图像加载失败"></td> <td><img src="<%=rs.getString(5)%>" width="220px" height="150px" alt="图像加载失败"></td> <td><img src="<%=rs.getString(6)%>" width="220px" height="150px" alt="图像加载失败"></td> <td><img src="<%=rs.getString(7)%>" width="220px" height="150px" alt="图像加载失败"></td> </tr> </table> </div> </div> <!--公司详情结束--> <jsp:include page="footer.jsp"></jsp:include> </div> <% } %> </body> </html>
现在处于jsp学习比较初级的阶段,代码中肯定有需要改进的地方,希望博客园的园友们不吝赐教.