web课程设计

WEB 程序设计

——电子相册

完成时间： 2009.6.21

1．网站简介………………………………………………………………1

2.网站开发平台和工具…………………………………………………1

3. 网站结构设计…………………………………………………………2

4． 主要模块实现与代码摘要…………………………………………………3-6

5． 课程设计总结……………………………………………………………………6

1 网站简介

随着社会的发展，各种各样的相册层出不穷，每一种相册都有他自己的特色，你可以根据自己的喜欢选择最适合你的相册。在这个网站里，你可以把朋友的相片上传到相册里，永远也不会丢失，把最美好的回忆留在这里。

2 开发平台和工具

3 网站结构设计

网站实现功能如下：

上传相片：把想要上传的相片上传到相册里。

浏览相片：查看你想要看的相片

4 主要模块实现与代码摘要

实现相片上传

上传相片代码：

<html>

<head><title>朋友图片上传</title></head>

<body>

</h1>

<script Language="JavaScript"><!--

function FrontPage_Form1_Validator(theForm)

{

if (theForm.name.value == "")

{

alert("请在 name 域中输入值。");

theForm.name.focus();

return (false);

}

if (theForm.name.value.length < 1)

{

alert("在 name 域中，请至少输入 1 个字符。");

theForm.name.focus();

return (false);

}

if (theForm.name.value.length > 20)

{

alert("在 name 域中，请最多输入 20 个字符。");

theForm.name.focus();

return (false);

}

return (true);

}

//--></script><form enctype="multipart/form-data"

method="post" action="http://202.194.139.157/php/get.php" onsubmit="return

FrontPage_Form1_Validator(this)" name="FrontPage_Form1">

<table border="1" width="100%" bgcolor="#66CCFF" bordercolorlight="#FFFF00"

bordercolordark="#FFFF00">

<tr>

<td width="31%" align="right" bordercolorlight="#FFFF00" bordercolordark="#FFFF00"><b><font

color="#0000FF">请输入您的姓名</font></b></td>

<td width="69%" bordercolorlight="#FFFF00" bordercolordark="#FFFF00"><!--webbot

bot="Validation" B-Value-Required="TRUE" I-Minimum-Length="1"

I-Maximum-Length="20" --><input type="text" name="name" size="20" maxlength="20"></td>

</tr>

<tr>

请选择或输入上传文件名:</font></b></td>

<td width="69%" bordercolorlight="#FFFF00" bordercolordark="#FFFF00"><input name="upfile"

type="file"><input type="submit" value="上传">

</td>

</tr>

</table>

</form>

第二篇：web课程设计

《Web程序设计（一）课程设计》

实验报告

2013年 12 月

一、实验目的

网络在线投票是目前网上比较常见的一个功能，利用此功能可以在互联

网上直接投票，并即时查看投票结果。利用此系统，用户投票比较方便并且用户还可以查看并分析投票结果，从中获得对自己有用的信息。

对我们而言，通过编制一个小型网络应用程序的课程设计，使我们巩固所学的ASP.NET的理论知识，把所学的理论知识应用于实际问题，培养综合运用所学知识解决实际问题的能力。初步掌握设计一个网上应用程序的思路、方法、步骤。巩固所学的有关知识，培养有关技能。

二、实验步骤

1.下载并安装配置JDK、eclipse、tomca【=‘【t软件，使计算机有一个程序开发设计的软件支持。

2.用access建立一个数据库，在数据库中按要求建立表，包括用户注册基本信息表、年龄信息表、收入信息表、文化程度表、娱乐方式信息表、体育运动信息表、电影类型表。

3.在JDK中新建一个工程，建立一个包，名为beans，其下建立一个java文件，名为conndb，其中写入数据库调用信息。

4.用代码编写出html页面和相应的jsp文件，包括导航页面、注册页面、register.jsp、登录页面、login.jsp、问卷调查页面、diaochasend.jsp、问卷结果显示页面。

5.在控制面板中用odbc桥接数据库。

6.配置并打开tomcat服务器，在服务器上运行项目，正确就完成，错误则进行修正。

三、系统设计

1)，页面设计：

导航页面：

注册页面：

登陆页面：

问卷调查页面：

跳转页面：

结果显示页面：

2)、功能设计

本系统主要有系统导航、用户注册、用户登录、问卷填写、结果统计功能。

3)、数据库设计

数据库表结构：

电影表：

年龄表:

收入表：

体育表：

学历表：

用户表：

娱乐表：

四、系统的核心代码

首页核心代码：

<%@ page language="java" contentType="text/html; charset=gbk"

pageEncoding="gbk"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>无标题文档</title>

<!--

#Layer1 {

position:absolute;

left:297px;

top:31px;

width:719px;

height:583px;

z-index:1;

}

#Layer2 {

position:absolute;

left:384px;

top:481px;

width:127px;

height:46px;

z-index:12;

}

body,td,th {

color: #000000;

}

#Layer3 {

position:absolute;

left:150px;

top:14px;

width:628px;

height:539px;

z-index:1;

}

body {

background-color: #00FF00;

}

.STYLE2 {

font-size: 36px;

font-weight: bold;

}

.STYLE5 {font-size: x-large; font-weight: bold; }

.STYLE6 {font-size: x-large}

#Layer4 {

position:absolute;

left:360px;

top:94px;

width:626px;

height:269px;

z-index:2;

}

-->

</style>

</head>

<body>

<h1 align="center" class="STYLE2">欢迎光临我的在线投票系统</h1>

</p>

</form>

</div>

</body>

</html>

问卷统计结果页面

<%@ page language="java" contentType="text/html; charset=utf-8" import="java.sql.ResultSet,com.yunshui.service.*"

pageEncoding="utf-8"%>

Integer a=(Integer)request.getSession().getAttribute("yunshui");

if(a==null||a==0){

response.sendRedirect("login.jsp");

}

ResultSet age, money, culture, play, sport, movie;

conndb cs=new conndb();

age=cs.getConn().prepareStatement("select * from nianling where id=1").executeQuery();

money=cs.getConn().prepareStatement("select * from shouru where id=1").executeQuery();

culture=cs.getConn().prepareStatement("select * from xueli where id=1").executeQuery();

play=cs.getConn().prepareStatement("select * from yule where id=1").executeQuery();

sport=cs.getConn().prepareStatement("select * from tiyu where id=1").executeQuery();

movie=cs.getConn().prepareStatement("select * from dianying where id=1").executeQuery();

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>问卷统计结果页面</title>

</head>

<tr><td align="center" colspan="2"><h2><font style="font-family:楷体">问卷统计结果</font></h2></td></tr>

<tr><td colspan="2"><b>1、您的年龄是多少？</b></td></tr>

<%if(age.next()){ %>

<%} %>

<tr><td colspan="2"><b>2、您的收入是多少？</b></td></tr>

<%if(money.next()){ %>

<%} %>

<tr><td colspan="2"><b>3、您的文化程度是什么？</b></td></tr>

<%if(culture.next()){ %>

<tr><td>高中以及以下</td><td><%=culture.getInt("wenhua1")%></td></tr>

<tr><td colspan="2"><b>4、您喜欢的娱乐方式有哪些？</b></td></tr>

<%} %>

<%if(play.next()){ %>

<%} %>

<tr><td colspan="2"><b>5、您喜欢的体育运动有哪些？</b></td></tr>

<%if(sport.next()){ %>

<%} %>

<tr><td colspan="2"><b>6、您喜欢的电影类型有哪些？</b></td></tr>

<%if(movie.next()){ %>

<%} %>

</table>

</body>

</html>

用户登录页面

<%@ page language="java" contentType="text/html; charset=gbk"

pageEncoding="gbk"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>欢迎你登录问卷系统</title>

</head>

</tr>

</tr>

</table>

</form>

</div>

</html>

注册页面

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

pageEncoding="utf-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>欢迎你的注册</title>

</head>

<td colspan="2">欢迎用户注册</td>

</tr>

<tr><td>性别:</td><td><input type="radio" name="sex" value="男"/>男

</select>

</td></tr>

<tr>

</td>

</tr>

</table>

</form>

</body>

</html>

跳转页面

<%@ page language="java" contentType="text/html; charset=utf-8" import="com.yunshui.service.*"

pageEncoding="utf-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

String age=request.getParameter("age");

String money=request.getParameter("money");

String culture=request.getParameter("culture");

String play[]=request.getParameterValues("play");

String sport[]=request.getParameterValues("sport");

String movie[]=request.getParameterValues("movie");

Integer a=(Integer)request.getSession().getAttribute("yunshui");

conndb conndb=new conndb();

conndb.update(a, age, money, culture, play, sport, movie);

request.getSession().setAttribute("isCheck","Y");

<html>

<head>

</head>

<tr><td align="center">问卷提交成功！</td></tr>

<tr><td><span id="time" style="color:red">5</span>秒种后自动调转到统计结果界面，<a href="jieguo.jsp">统计结果页面</a>

</table>

function delayURL(url) {

var time=document.getElementById("time").innerHTML;

if(time>0){

time--;

document.getElementById("time").innerHTML=time;

}else{

window.top.location.href=url;

}

setTimeout("delayURL('"+url+"')", 1000);

}

</script>

delayURL("jieguo.jsp");

</script>

</body>

</html>

问卷页面

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

pageEncoding="utf-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

</head>

<tr>

<td>1、您的年龄是多少？</td>

</tr>

<tr>

<input type="radio" name="age" value="age1" >20岁以及以下

<input type="radio" name="age" value="age2" >21-35岁

<input type="radio" name="age" value="age3" >36-50岁

<input type="radio" name="age" value="age4" >50岁以上

</tr>

<tr>

<td height="50">2、您的收入是多少？</td>

</tr>

<input type="radio" name="money" value="income1">3000元以下

<input type="radio" name="money" value="income2">3000-5000元

<input type="radio" name="money" value="income3">5000-8000元

<input type="radio" name="money" value="income4">8000-10000元

<input type="radio" name="money" value="income5">10000元以上

</tr>

<tr>

<td height="50">3、您的文化程度是什么？</td>

</tr>

<input type="radio" name="culture" value="wenhua1">高中及以下

<input type="radio" name ="culture" value="wenhua2">大专

<input type="radio" name ="culture" value="wenhua3">本科

<input type="radio" name ="wenhua" value="wenhua4">研究生

</td>

</tr>

<tr>

<td height="50">4、您喜欢的娱乐方式有哪些？</td>

</tr>

<input type="checkbox" name="play" value="dianying">看电影

<input type="checkbox" name ="play" value="dianshi">看电视

<input type="checkbox" name ="play" value="shangwang">上网

<input type="checkbox" name ="play" value="tiyu">体育运动

<input type="checkbox" name ="play" value="qita">其他

</td>

</tr>

<tr>

<td height="50">5、您喜欢的体育运动有哪些？</td>

</tr>

<input type="checkbox" name="sport" value="paobu">跑步

<input type="checkbox" name ="sport" value="danche">骑单车

<input type="checkbox" name ="sport" value="qixie">器械

<input type="checkbox" name ="sport" value="yujia">瑜伽

<input type="checkbox" name ="sport" value="qita">其他

</td>

</tr>

<tr>

<td height="50">6、您喜欢的电影类型有哪些？</td>

</tr>

<input type="checkbox" name="movie" value="kehuan">科幻片

<input type="checkbox" name ="movie" value="juqing">剧情片

<input type="checkbox" name ="movie" value="xuanyi">悬疑片

<input type="checkbox" name ="movie" value="dongzuo">动作片

<input type="checkbox" name ="movie" value="qita">其他

</td>

</tr>

<tr>

</tr>

</table>

</form>

</body>

跳转处理页面

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" import="com.yunshui.service.*"

pageEncoding="ISO-8859-1"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>Insert title here</title>

</head>

<body>

String username=request.getParameter("username");

String password=request.getParameter("password");

String realname=request.getParameter("realname");

String sex=request.getParameter("sex");

String shengfen=request.getParameter("shengfen");

conndb conndb=new conndb();

conndb.yhm(username, password, realname, sex, shengfen);

response.sendRedirect("login.jsp");

</body>

</html>

Java代码

package com.yunshui.service;

import java.sql.Connection;

import java.sql.DriverManager;

import java.sql.PreparedStatement;

import java.sql.ResultSet;

import java.sql.SQLException;

public class conndb {

private Connection conn=null;

private PreparedStatement statement=null;

private ResultSet set=null;

public Connection getConn(){

String driverName = "sun.jdbc.odbc.JdbcOdbcDriver"; //加载JDBC驱动

String dbURL = "jdbc:odbc:dbs"; //连接服务器和数据库sample

String userName = ""; //默认用户名

String userPwd = ""; //密码 Connection dbConn;

try {

Class.forName(driverName);

conn = DriverManager.getConnection(dbURL, userName, userPwd);

} catch (Exception e) {

e.printStackTrace();

}

return conn;

}

public void yhm(String username,String password,String realname,String sex,String shengfen){

String sql="insert into yonghu (username,password,realname,sex,shengfen,isCheck) values(?,?,?,?,?,?)";

try {

statement=getConn().prepareStatement(sql);

statement.setString(1, username);

statement.setString(2, password);

statement.setString(3, realname);

statement.setString(4, sex);

statement.setString(5, shengfen);

statement.setString(6, "N");

statement.executeUpdate();

} catch (SQLException e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

} public int denglu(String username,String password){

String sql="select * from yonghu where username=? and password=?";

try {

conn=getConn();

statement=conn.prepareStatement(sql);

statement.setString(1, username);

statement.setString(2, password);

set=statement.executeQuery();

if(set.next()){

return set.getInt("id");

}

} catch (SQLException e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

return 0;

}public void update(int a,String age,String money,String culture,String play[],String sport[],String movie[]){

try {

if(age!=null&&!age.equals("")){

String s="select * from nianling where id=1";

statement=getConn().prepareStatement(s);

set=statement.executeQuery();

if(set.next()){

String sql="update nianling set "+age+"="+age+"+1 where id=1";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}else{

String sql="insert into nianling (id,"+age+") values(1,1)";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

if(money!=null&&!money.equals("")){

String s="select * from shouru where id=1";

statement=getConn().prepareStatement(s);

set=statement.executeQuery();

if(set.next()){

String sql="update shouru set "+money+"="+money+"+1 where id=1";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}else{

String sql="insert into shouru (id,"+money+") values(1,1)";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

if(culture!=null&&!culture.equals("")){

String s="select * from xueli where id=1";

statement=getConn().prepareStatement(s);

set=statement.executeQuery();

if(set.next()){

String sql="update xueli set "+culture+"="+culture+"+1 where id=1";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}else{

String sql="insert into xueli (id,"+culture+") values(1,1)";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

if(play!=null&&play.length>0){

String s="select * from yule where id=1";

statement=getConn().prepareStatement(s);

set=statement.executeQuery();

if(set.next()){

for(int i=0;i<play.length;i++){

String sql="update yule set "+play[i]+"="+play[i]+"+1 where id=1";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

}else{

StringBuffer sb1=new StringBuffer();

StringBuffer sb2=new StringBuffer();

for(int i=0;i<play.length;i++){

sb1.append(play[i]).append(",");

sb2.append(1).append(",");

}

sb1.deleteCharAt(sb1.length()-1);

sb2.deleteCharAt(sb2.length()-1);

String sql="insert into yule (id,"+sb1.toString()+") values(1,"+sb2.toString()+")";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

if(sport!=null&&sport.length>0){

String s="select * from tiyu where id=1";

statement=getConn().prepareStatement(s);

set=statement.executeQuery();

if(set.next()){

for(int i=0;i<sport.length;i++){

String sql="update tiyu set "+sport[i]+"="+sport[i]+"+1 where id=1";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

}else{

StringBuffer sb1=new StringBuffer();

StringBuffer sb2=new StringBuffer();

for(int i=0;i<sport.length;i++){

sb1.append(sport[i]).append(",");

sb2.append(1).append(",");

}

sb1.deleteCharAt(sb1.length()-1);

sb2.deleteCharAt(sb2.length()-1);

String sql="insert into tiyu (id,"+sb1.toString()+") values(1,"+sb2.toString()+")";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

if(movie!=null&&movie.length>0){

String s="select * from dianying where id=1";

statement=getConn().prepareStatement(s);

set=statement.executeQuery();

if(set.next()){

for(int i=0;i<movie.length;i++){

String sql="update dianying set "+movie[i]+"="+movie[i]+"+1 where id=1";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

}else{

StringBuffer sb1=new StringBuffer();

StringBuffer sb2=new StringBuffer();

for(int i=0;i<movie.length;i++){

sb1.append(movie[i]).append(",");

sb2.append(1).append(",");

}

sb1.deleteCharAt(sb1.length()-1);

sb2.deleteCharAt(sb2.length()-1);

String sql="insert into dianying (id,"+sb1.toString()+") values(1,"+sb2.toString()+")";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

if(a!=0){

String sql="update yonghu set isCheck='Y' where id="+a+"";

statement=getConn().prepareStatement(sql);

statement.executeUpdate();

}

} catch (Exception e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

五·实验总结

通过此次实验，我学习了jdk，tomcat，eclipse等软件的使用，并且对他们的使用有了一定的认知，但是我也认识到我只是的匮乏，操作能力的不足，同时发现自己对jsp语言便血系统不熟练编写的，需要在以后的学习中不断加以练习而不仅仅停留在书面知识层面。同时感谢老师老师给了我们这样一个发现自己知识不足的条件，让我们认识到自己的不足，在今后的学习中要脚踏实地，努力学习学习，学号java这门课！

相关推荐

web课程设计

第二篇：web课程设计

专栏推荐