第一节 HTML表单提交数据和JSP获得数据

第一节 HTML表单提交数据和JSP获得数据

为了学习掌握JSP动态网页的设计开发，我们先从大家比较熟悉的表单入手。以前在学习静态网页设计时，做好的表单无法提交数据，那是因为没有接收数据的程序。本节使用一组范例，由HTML的表单提交数据，并使用JSP动态网页获得数据，来说明他们之间的关系和工作原理。

一、范例的演示和代码清单

演示的前提：

1.配置好开发运行环境；

2.将随书光盘中的范例ch2，复制到resin2.1.6\doc文件夹内；

3.启动JSP引擎；

演示步骤：

1.启动IE，在地址栏键入http://127.0.0.1:8080/ch2/ch2-1.htm，如图2-1所示：

图2-1

2.在表单的姓名栏键入“张三”，年龄栏键入“21”，性别选择其中的一项，密码栏

键入“123”，然后点击“提交”按钮。屏幕出现2-2所示界面：

图2-2

注意：访问动态网页必须在启动JSP引擎后，在IE的地址栏键入IP地址和路径文件名，才能进行访问，不能使用直接双击打开的方式。

网页的页面上显示了所提交数据的全部内容。请注意，地址栏上的内容是：http://127.0.0.1:8080/ch2/ch2-1.jsp。这说明提交的数据已被ch2-1.jsp动态网页接收，并将其送到屏幕上进行显示。

当然，可以在表单中填写其他的内容，屏幕显示的内容会随之变化。但是如果在“年龄”项目中填写的不是数字，而是字母、汉字等不正确的内容，屏幕上也会将这些错误内容显示出来，甚至任何一项都不填写，直接点击“提交”按钮，动态网页仍能正常运行。这些问题，我们会在以后的章节中去一一解决。目前先要弄清HTML静态网页和JSP动态网页之间的关系。

两个网页的代码如下：

◇－◇－◇－◇－◇－◇－◇－◇－◇－◇表单◇－◇－◇－◇－◇－◇－◇－◇－◇－◇

范例ch2-1.htm

1)

2)

3)

4)

5)

6)

7)

8)

使用表单提交数据

9)

10)

 

11)

姓名：

12)

13)

14)

性别：

15)

16)男

17)

18)女

19)

年龄：

20)

21)

22)

密码：

23)

24)

25)

 

26)

27)

28)

31)

32)

33)

29) 30)

34)

 

35)

36)

37)

38)

◇

范例ch2-1.jsp

1)<%@page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="" %>

2)

3)

4)

5)

6)

7)

8)

动态网页接收的数据

9)

10)<% ! //定义接收HTML数据的变量

11)String name;

12)String xingbie;

13)String nianling;

14)String password;

15)%>

16)<% //接收HTML数据

17)name=request.getParameter("xingming");

18)xingbie=request.getParameter("xingbie");

19)nianling=request.getParameter("nianling");

20)password=request.getParameter("mima");

21)//将数据送到屏幕上显示

22)out.print(“姓名：”+name);

23)out.print(“

性别：”+xingbie);

24)out.print(“

年龄：”+nianling);

25)out.print(“

密码：”+password);

26)%>

27)

28)

返回表单

29)

30)

二、HTML表单的构成分析

HTML的表单网页，给人最直观的印象就是页面上的各种表单项，比如文本框、密码框、单选按钮、复选项、下拉列表菜单、提交按钮等。实际上，和JSP动态网页发生联系，还有表单（域）的概念。

1.表单项

要分析HTML表单中的元素及其作用，首先启动Dreamweaver，在图形设计界面即可看到图2-3所示界面：

图2-3

图2-3中有七个表单项，分别是对应“姓名”的文本域，对应“性别”的两个单选按钮，对应“年龄”的文本域，对应“密码”的文本域，以及“提交”、“重写”两个按钮。此时可以把每个表单项看成一个用来存放用户提交数据的容器。每个表单项都有一系列的属性，这