Jsp+Sevlet新闻发布系统

一开始叫我写这个新闻发布系统的时候其实我是拒绝的，因为我有事，我想去写我的考试系统，但是他们说这个有学分，写完之后毕业变得很简单、很轻松。duang～的一下就毕业了，我才答应开始写新闻发布系统。

我的java也只学了个初级阶段，这个项目要用jsp写，tomcat做服务器。那看来我只能拿出我这个学期学了一个学期的javaee的知识来解决这个问题了。

废话不多说，项目开始......

1.首先，我为数据库设计了一张表：新闻表（本系统唯一一张表），感觉本系统表设多了并没什么卵用。

2.把dao层的方法写出来，以便后期使用。

3.界面设计（参考了一些网站，本来html就只学了一点皮毛，做起网页来老费尽了，2，3天憋出一个网页）

（1）系统首页。功能:

提供了所有新闻的浏览

提供了新闻按类别查询

提供了新闻按关键字查询

（2）后台界面。功能：

提供了新闻的删除修改，以及发布。

（3）发布新闻界面（样式是网上下载的）

提供了发布新闻的功能，可以显示图片的缩略图。

把实现jsp页面内图片预览的代码在这mark一下，做个笔记：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.io.*,java.util.*" %>
<%@ page import="org.springframework.context.ApplicationContext"%>
<%@ page import="org.springframework.context.support.ClassPathXmlApplicationContext"%>
<%@ page import="com.lt.News.model.News"%>
<%@ page import="com.lt.News.service.NewsService"%>
<!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>发布新闻</title>

<script>   
	function PreviewImage(imgFile) {
		var pattern = /(\.*.jpg$)|(\.*.png$)|(\.*.jpeg$)|(\.*.gif$)|(\.*.bmp$)/;
		if (!pattern.test(imgFile.value)) {
			alert("系统仅支持jpg/jpeg/png/gif/bmp格式的照片！");
			imgFile.focus();
		} 
		path = URL.createObjectURL(imgFile.files[0]);
		document.getElementById("imgPreview").innerHTML = "<img src='"+path+"' style='width:227px; height:130px;' />";
	}
</script>

<style>
body {
	margin-left:auto;
	margin-right:auto;
	max-width: 500px;
	background: #F7F7F7;
	padding: 25px 15px 25px 10px;
	font: 12px Georgia, "Times New Roman", Times, serif;
	color: #888;
	text-shadow: 1px 1px 1px #FFF;
	border:1px solid #E4E4E4;
}
h1 {
	font-size: 25px;
	padding: 0px 0px 10px 40px;
	display: block;
	border-bottom:1px solid #E4E4E4;
	margin: -10px -15px 30px -10px;;
	color: #888;
}
h1>span {
	display: block;
	font-size: 11px;
}
.basic-grey label {
	display: block;
	margin: 0px;
}
label>span {
	float: left;
	width: 20%;
	text-align: right;
	padding-right: 10px;
	margin-top: 10px;
	color: #888;
}
input[type="text"],  input[type="email"],  textarea,  select {
	border: 1px solid #DADADA;
	color: #888;
	height: 30px;
	margin-bottom: 16px;
	margin-right: 6px;
	margin-top: 2px;
	outline: 0 none;
	padding: 3px 3px 3px 5px;
	width: 70%;
	font-size: 12px;
	line-height:15px;
	box-shadow: inset 0px 1px 4px #ECECEC;
	-moz-box-shadow: inset 0px 1px 4px #ECECEC;
	-webkit-box-shadow: inset 0px 1px 4px #ECECEC;
}

#pic
{
	border: 1px solid #DADADA;
	color: #888;
	height: 150px;
	margin-bottom: 16px;
	margin-right: 6px;
	margin-top: 2px;
	margin-left:110px;
	outline: 0 none;
	padding: 3px 3px 3px 5px;
	width: 70%;
	font-size: 12px;
	line-height:15px;
	box-shadow: inset 0px 1px 4px #ECECEC;
	-moz-box-shadow: inset 0px 1px 4px #ECECEC;
	-webkit-box-shadow: inset 0px 1px 4px #ECECEC;
}

textarea{
	padding: 5px 3px 3px 5px;
}

select {
	background: #FFF url('down-arrow.png') no-repeat right;
	background: #FFF url('down-arrow.png') no-repeat right);
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance: none;
	text-indent: 0.01px;
	text-overflow: '';
	width: 72%;
	height: 35px;
	line-height: 25px;
}

textarea{
	height:100px;
}
.button {
	background: #E27575;
	border: none;
	padding: 10px 25px 10px 25px;
	color: #FFF;
	box-shadow: 1px 1px 5px #B6B6B6;
	border-radius: 3px;
	text-shadow: 1px 1px 1px #9E3F3F;
	cursor: pointer;
}

.button:hover {
	background: #CF7A7A
}
</style>

</head>

<body>
	<%
		String title = "";
		String author= "";
		String content = "";
		String update = (String)session.getAttribute("update");
		
		if(update!=null)
		{
			ApplicationContext ac = new ClassPathXmlApplicationContext("applicationContext.xml");
			NewsService newsService = (NewsService) ac.getBean("NewsService");
			News news = newsService.getNews(Integer.parseInt(update));
			
			title = news.getTitle();
			author = news.getAuthor();
			content = news.getContent();
		}
		
	%>

	<form action="PublishNews" method="post" class="STYLE-NAME">
	
		<h1><%if(update==null || update.equals("0")){%>新闻发布<%}else{%>新闻修改<%} %>
		<span>Please fill all the texts in the fields.</span>
		</h1>
		
		<label>
			<span>标题 :</span>
			<input id="name" type="text" name="title" value="<%=title %>" />
		</label>
		
		<label>
			<span>作者 :</span>
			<input id="email" type="text" name="author" value="<%=author %>" />
		</label>
		
		<label>
			<span>内容 :</span>
			<textarea id="message" name="content" ><%=content %></textarea>
		</label>
		
		<label>
		<br /><span>图片 :</span>
			<div id="pic">
					<input type="file" name="pic" onchange='PreviewImage(this)'/>
					<div id="imgPreview"> </div>
			</div>
		</label>
		
		<label>
			<span>类型 :</span>
			<select name="type">
				<option value="社会">社会</option>
				<option value="娱乐">娱乐</option>
				<option value="娱乐">军事</option>
				<option value="娱乐">体育</option>
				<option value="娱乐">财经</option>
			</select>
		</label>
		
		<label>
			<span> </span>
			<input type="submit" class="button" value="发布" />
		</label>
		
	</form>
</body>

</html>

（4）修改新闻界面（和新闻发布界面一样，只是处理方式不同）

（5）显示新闻界面

显示了新闻有关信息，访问量，评论等。

学了这么久的java，只有这个项目才算是最完整的了，之前做了几个项目都是由于种种原因而中途夭折了。

整个项目单独完成，耗时一个星期，简直是慢的出奇了。应该是练得太少不够熟练。

这个暑假要开始java中级阶段的学习了，更要努力了。

这里放出源码，看到我这篇文章的朋友可以根据需要下载，欢迎多多批评指正！http://pan.baidu.com/s/1c0CXgnm

Jsp+Sevlet新闻发布系统

猜你喜欢