1. 任务
本篇来实现新闻内容查看页面。
2. 具体功能
在新闻浏览页面选择一条新闻点击后,跳转新闻内容查看页面,页面上面显示新闻的标题,中间显示新闻内容。
效果如下:
3. 开发
3.1 查看原来的跳转链接
原来的跳转连接是这样的:
row += "<td><a href='article.jsp?id=" + rs.getString("id") + "'>" + rs.getString("title") + "</a></td>";
也就是说,点击新闻标题后,会跳转到article.jsp?id=x
,即跳转到article.jsp
页面,同时会传递该条新闻的id过来。
3.2 新建article.jsp页面
既然要跳转article.jsp页面,我们需要先建立该页面,代码如下:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.sql.*"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>新闻浏览</title>
<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div class="header-bar">
<span class="header-title">SchoolNews--校园新闻网</span> <a
class="header-button" href="login.jsp">登录</a>
</div>
</body>
</html>
3.3 根据id从数据库查询并显示
获取传递过来的id值,然后从数据库中查出对应新闻的信息,并显示到页面上。
<body>
<div class="header-bar">
<span class="header-title">SchoolNews--校园新闻网</span> <a
class="header-button" href="login.jsp">登录</a>
</div>
<div>
<%
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/schoolnews?characterEncoding=UTF-8";
String username = "root";
String password = "Easy@0122";
Connection conn = DriverManager.getConnection(url, username, password);
String id = request.getParameter("id");
String sql = "select * from news where id=" + id;
PreparedStatement st = conn.prepareStatement(sql);// 在此次传入,进行预编译
ResultSet rs = st.executeQuery();
rs.next();
%>
<h1 class="article-title"><%=rs.getString("title")%></h1>
<div><%=rs.getString("content")%></div>
</div>
</body>
</html>
3.4 为新闻标题添加样式
标题的样式改下,在style.css中添加
/* 标题样式 */
.article-title {
color: #00CC6A;
}
4. 总结
该页面负责接收新闻浏览页面传递过来的新闻id,从数据库中查出对应新闻的内容后显示到页面上即可。