好久没更了,一周完成了SRDP,一周完成了课程设计,这一周就要好好回顾回顾Java Web的学习轨迹了。
用的eclipse Mars
一、表单
start.jsp
<%@ 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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Review</title> </head> <body> <p>表格应用</p> <table border=1 width=600 align="center" cellpadding="3" cellspacing="2" background="../images/me.jpg"> <tr align="center"> <td colspan="6"><b>成绩单</b></td> </tr> <tr align="center"> <th>学号</th> <th>姓名</th> <th>C++课程设计</th> <th>Web开发</th> <th>软件开发</th> <th>信息伦理学</th> <tr align="left"> <td>1402003100</td><td>海小</td><td>90</td><td>95</td><td>100</td><td>95</td> <tr align="left"> <td>1402003109</td><td>杜丽</td><td>96</td><td>98</td><td>100</td><td>98</td> <tr align="left"> <td>1402003110</td><td>小小</td><td>89</td><td>89</td><td>99</td><td>90</td> </table> </body> </html>
显示结果:
二、框架
frame.jsp
<%@ 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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>框架应用</title> </head> <body> <frameset rows="80,*" cols="*" frameborder="yes" border="2" bordercolor="#A572AA"> <frame src="top.jsp" name="topFrame"> <frameset cols="15%, 85%" frameborder="yes" border="2" bordercolor="#A572AA"> <frame src="left.jsp" name="mainFrame"> </frameset> </frameset> </body> </html>
left.jsp
<%@ 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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>LeftFrame</title> </head> <body bgcolor="#EAD0D9"> <font size="5"> <p><a href="main0.jsp" target="mianFrame">第一章 回答在牛奶箱里</a></p> <p><a href="main1.jsp" target="mainFrame">第二章 深夜的口琴声</a></p> <p><a href="main2.jsp" target="mainFrame">第三章 在思域车上等到天亮</a> <p>第四章 听着披头士祈祷</p> <p>第五章 来自天上的祈祷</p> </font> </body> </html>
三、表单综合应用
TableApply.jsp
<%@ 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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>TableApply</title> </head> <body> <form action="" method="post"enctype="multipart/form-data" name="forml1"> <table width="500" border="2" align="center bgcolor="#F2F2F2" bordercolor=#A76BAB> <tr> <td colspan="2" align="center">时光之旅注册</td> </tr> <tr> <td width="100" align="right">用户名:</td> <td width="410"><input type="text" name="userid"></td> </tr> <tr> <td align="right">密码:</td> <td><input type="password" name="pass"></td> </tr> <tr> <td align="right">确认密码:</td> <td><input type="password" name="pass2"></td> </tr> <tr> <td align="right">性别</td> <td> <input type="radio" name="gender" value="male">男 <input type="radio" name="gender" value="female">女 </td> </tr> <tr> <td align="right">特长:</td> <td><input type="checkbox" name="checkbox" value="001">绘画 <input type="checkbox" name="checkbox2" value="002">软件 <input type="checkbox" name="checkbox3" value="003">文学 <input type="checkbox" name="checkbox4" value="004">前端 <input type="checkbox" name="checkbox5" value="005">其它 </td> </tr> <tr> <td align="right">仙居:</td> <td><select name="select"> <option value="01">北京</option> <option value="02">青岛</option> <option value="03">上海</option> <option value="04">杭州</option> <option value="05">南京</option> <option value="06">兰州</option> </select> </td> </tr> <tr> <td align="right">照片:</td> <td><input type="file" name="photo"></td> </tr> <tr> <td align="right">留言:</td> <td><textarea name="textfield" rows="4"></textarea></td> </tr> <tr> <td> </td> <td><input type="submit" name="Submit" value="提交"> <input type="reset" name="Submit2" value="重置"></td> </tr> </table> </form> </body> </html>
效果图:
JavaScript小回顾:
一、显示日期:
Date.jsp
<%@ 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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JavaScript Review</title> </head> <body> <script language="JavaScript"> //通过日期类Date的对象来获取当前的年月日和星期 var today = new Date(); var day = today.getDate(); var month = today.getMonth()+1; var year = today.getFullYear(); var week = today.getDay(); var vw = new Arry("星期天","星期一","星期二","星期三","星期四","星期五","星期六"); document.write("今天是:"+year+"年"+month+"月"+day+"日"+vw[week]); document.title="今天是"+year+"年"+month+"月"+day+"日"+vw[week]; </script> </body> </html>
二、基础的表单验证
FormCheck.jsp
<%@ 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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>表单验证</title> </head> <body bgcolor="#F8F8F8"> <form name="forml1" action="#" onSubmit="return check()"> 用户名:<input type="text" name="user"><br> 邮 件:<input type="text" name="email"><br> <input type="submit" name="button" value="提交"> </form> </body> </html> <script language="JavaScript"> <!-- function check(){ if(document.form1.user.value.length==0){ alert("请输入用户名~"); return false; } if(document.form1.email.value.indexOf("@")==-1 ||document.form1.email1.value.length==0){ alert("请输入正确的email地址"); return false; } return true; } //--> </script>
表单整理先到这儿。。整理数据库去啦。。一个人霸占一个偌大的教室棒极了哇卡卡。。