完成一个简单的用户注册系统,系统涉及下列文件:
1.registor.jsp: 录入用户信息,综合使用表单的功能:
form标记(表单采用POST方法发送)
text:用户名、口令
radio按钮:性别
select:出生年月、所在地、行业其中会使用到option标记
checkbox:选择兴趣
textarea:自我介绍
按钮:提交和重新输入
1.首先,根据要求,先编写注册信息的界面,即如下所示的界面;其中,用户名,密码用text,出生年月,所在地,行业用到select,性别用到radio按钮,爱好用到checkbox,自我介绍用到了textarea;
2.将将整个form放在一个容器中(div),然后对容器设置简单的css样式,使其居中显示;
3.将每一项都用到了<P>标记,从而使他们都居中显示;
最终的界面如下所示:
Registor.jsp的代码如下:
<%@pagelanguage="java"contentType="text/html;charset=GBK"
pageEncoding="GBK"%>
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=GBK">
<title>Inserttitlehere</title>
<styletype="text/css">
div{
margin:0auto;
width:300px;
}
</style>
</head>
<body>
<div>
<formid="from1"name="form1"method="post"action="record.jsp">
<p>用户名:
<inputname="username"type="text"id="username"size="15"/></p>
<p>密码:
<inputname="passwd"type="password"id="pwd"size=15/></p>
<p>性别:男
<inputname="sex"type="radio"value="1"/>
女
<inputname="sex"type="radio"value="2"/></p>
<p>出生年月:
<selectname="year">
<optionvalue="1">2000</option>
<optionvalue="2">2001</option>
<optionvalue="3">2002</option>
<optionvalue="4">2003</option>
<optionvalue="5">2004</option>
<optionvalue="6">2005</option>
<optionvalue="7">2006</option>
<optionvalue="8">2007</option>
<optionvalue="9">2008</option>
<optionvalue="10">2009</option>
<optionvalue="11">2010</option>
<optionvalue="12">2011</option>
</select>年
<selectname="month">
<optionvalue="1">01</option>
<optionvalue="2">02</option>
<optionvalue="3">03</option>
<optionvalue="4">04</option>
<optionvalue="5">05</option>
<optionvalue="6">06</option>
<optionvalue="7">07</option>
<optionvalue="8">08</option>
<optionvalue="9">09</option>
<optionvalue="10">10</option>
<optionvalue="11">11</option>
<optionvalue="12">12</option>
</select>月</p>
<p>所在地:
<selectname="address">
<optionvalue="a">北京市</option>
<optionvalue="b">河南省</option>
<optionvalue="c">河北省</option>
<optionvalue="d">山东省</option>
<optionvalue="e">安徽省</option>
<optionvalue="f">江苏省</option>
<optionvalue="g">云南省</option>
<optionvalue="h">湖南省</option>
<optionvalue="i">湖北省</option>
<optionvalue="j">陕西省</option>
<optionvalue="k">山西省</option>
<optionvalue="l">上海市</option>
</select></p>
<p>行业:
<selectname="hangye">
<optionvalue="1">软件工程师</option>
<optionvalue="2">软件测试师</option>
<optionvalue="3">会计师</option>
<optionvalue="4">厨师</option>
<optionvalue="5">售货员</option>
<optionvalue="6">超市保洁员</option>
<optionvalue="7">超市推销员</option>
<optionvalue="8">CAD工程师</option>
</select></p>
<p>爱好:
<inputname="fav"type="checkbox"value="1"/>跳舞
<inputname="fav"type="checkbox"value="2"/>唱歌
<inputname="fav"type="checkbox"value="3"/>散步</p>
<p>自我介绍:
<textareaname="introduction"οnfοcus="this.value=''"></textarea></p>
<p><buttontype="submit">提交</button>
<buttontype="reset">重置</button></p>
</form>
</div>
</body>
</html>