表单标签:用于与服务端交互
<form action=”表单提交目的地” method=”表单提交方式”></form>
form标签内的组件:input接收用户输入数据 select下拉列表 textarea文本区域
<input type=”text” name=”user” value=”zhangsan” />
input标签内要指定name属性,服务端才能获取到对应的value
input内包含的组件类型 通过type指定:
text文本框 password密码框
radio单选框 属于同一组的选择框name属性要一致,不然单选框不能实现单选
checkbox复选框 分组 同单选框 单选框不加属性时还不让你选
file 提供一个文件浏览按钮,多用于上传文件
hidden 隐藏组件,不需用户看到但服务端要用到,可通过JavaScript将其值在用户端运算后再提交至服务端使用
button 按钮 通过onclick方法添加事件监听
reset 重置按钮 submit 提交按钮
image 和submit一样,但可通过src属性指定一个图片充当按钮 美化效果
<select>选择列表,默认单选下拉式 设定multiple属性使选项全部列出,无下拉效果
size属性指定显示多少项,显示不完出现滚动条
通过<option></option>标签封装列表项
<textarea cols=”” rows=””> 文本区域 可指定行数和列数
构建一个服务器:
import java.net.*;
import java.io.*;
class RegServer{
public static void main(String [] args) throws Exception{
ServerSocket ss=new ServerSocket (10009);
Socket s= ss.accept();
InputStream in=s.getInputStream();
byte[] buf = new byte[1024];
int len=in.read(buf);
System.out.println(new String(buf,0,len));
OutputStream out=s.getOutputStream();
PrintWriter pw=new PrintWriter(out,true);
pw.println("<font size=7 color=green>注册成功</font>");
s.close();
ss.close();
}
}
<fieleset>区域设置,可给form加外框 外框上的文字可用legend标签指定
form中的method指定提交方式,有7中,常用get和post
用Java自定义服务端与form交互 查看数据提交不同之处
get提交:信息显示在地址栏中,敏感信息泄露,不安全;
地址栏存储信息量有限,不利于大数据量提交;
将信息封装在消息头前边;
提交至服务端的中文乱码需要再次编码后再解码
post:地址栏上不显示提交的信息,避免信息泄露,安全;
提交数据量无限制,方便大数据提交;
将信息封装在消息头后边(空行后)的数据体中;
中文乱码可通过设定字符集方法简单搞定
Tomcat服务端默认使用的iso8859编码,两种提交方式提交中文时,服务端会显示乱码,需要在服务端使用指定字符集解码,request.setCharacterEncoding(“GBK”)但设定字符集方法只对数据体中的数据有效,get方式提交的信息封装在消息头中,不能使用这种方法。但可以通过先用iso8859编码再GBK解码的方式解决。推荐使用post方式提交。
表单代码:
<html>
<body>
<form action="http://192.168.3.100:10009" method="get">
<table border="1" bordercorlordark="#0066FF" width="70%">
<tr><td colspan="2">注册页面</td></tr>
<tr><td><label accesskey="m" for="userid">用户名(U):</label></td><td><input type="text" name="user" id="userid"/></td></tr>
<tr><td>密码:</td><td><input type="password" name="pwd"/></td></tr>
<tr><td>确认密码</td><td><input type="password" name="rpwd"/></td></tr>
<tr><td>性别:</td><td><input type="radio" name="sex"/>男
<input type="radio" name="sex"/>女</td></tr>
<tr><td>技术</td><td><input type="checkbox" name="java" value="java"/>java
<input type="checkbox" name="css" value="css"/>css
<input type="checkbox" name="html" value="html"/>html</td></tr>
<tr><td>国家</td><td><select name="country">
<option value="none">--选择国家--</option>
<option value="cn">中国</option>
<option value="en">英国</option>
<option value="us">美国</option>
</select></td></tr>
<tr><th colspan="2"><input type="submit" value="提交数据"/><input type="reset" value="清楚数据"/></th></tr>
</table>
</form>
</body>
</html>