JSP 表单( form )

现在的网页都越来越注重交互体验,使用 HTML form 向服务器提交信息,并让后台程序处理

浏览器中使用 GET 和 POST 方法向服务器提交数据

JSP 可以处理浏览器使用 GET 和 POST 方法发送的数据

HTML 表单

GET 方法

HTTP GET 方法将请求的数据信息添加在网址后面,网址与数据信息通过"?"号分隔

http://localhost:8080/jsp/form_get.jsp?name=简单教程&url=www.twle.cn

GET 方法是浏览器默认传递参数的方法,一些敏感信息,如密码等建议不要使用 GET 方法

GET 方法传递数据有大小限制 (注意不是参数的个数有限制),最大为 1024 字节

POST 方法

一些敏感信息,如密码等我们可以通过 POST 方法传递,POST 提交数据是隐式的

POST 提交数据是不可见的,GET 是通过在 url 里面传递的(可以看一下你浏览器的地址栏)

JSP 处理表单数据

JSP 使用 request.getParameter() 来获得表单传递的参数

使用 request.getInputStream()方法来处理表单提交的二进制数据流的请求

JSP 读取表单数据方法

方法 说明
getParameter() 使用 request.getParameter() 方法来获取表单参数的值
getParameterValues() 获得如checkbox类(名字相同,但值有多个)的数据
接收数组变量 ,如checkbox类型
getParameterNames() 获得所有变量的名称,该方法返回一个Emumeration
getInputStream() 读取来自客户端的二进制数据流

范例 : JSP 获取 URL 上传递的参数

假设我们有一个简单的 URL,URL 上传递了 nameurl 两个参数

现在,我们写一个 JSP 页面 form_get.jsp 来获得这两个参数的内容

http://localhost:8080/jsp/form_get.jsp?name=简单教程&url=www.twle.cn

我们使用以下方法来获得 name 和 greet

String name  = request.getParameter("name");
String url   = request.getParameter("url");

下面是 form_get.jsp 的代码

form_get.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.io.*,java.util.*" %>
<!DOCTYPE html>
<meta charset="utf-8">
<title>使用 GET 方法传递数据 - JSP 基础教程 | 简单教程(www.twle.cn)</title>
<ul>
<li><p><b>站点名:</b>
   <%= request.getParameter("name")%>
</p></li>
<li><p><b>网址:</b>
   <%= request.getParameter("url")%>
</p></li>
</ul>
<p>使用 GET 方法传递数据 - JSP 基础教程 | 简单教程(www.twle.cn)</p>

在浏览器上输入

http://localhost:8080/jsp/form_get.jsp?name=简单教程&url=www.twle.cn

显示如下

使用 HTML 表单的 GET 方法提交参数

上面的范例,我们已经实现了使用 URL 来传递参数,并输出参数的内容

但这样太复杂了,而且用户体验不好,最好的方法就是制作一个 HTML 表单可以编辑并提交这些数据

现在,我们来制作一个表单 form.jsp,它使用 GET 方法向 form_get.jsp 提交数据

webapp/form.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<meta charset="utf-8">
<title>HTML 表单提交数据(GET) - JSP 基础教程 | 简单教程(www.twle.cn)</title>
<form action="form_get.jsp" method="GET">
站点: <input type="text" name="name">
<br />
网址: <input type="text" name="url" />
<input type="submit" value="提交" />
</form>
<p>HTML 表单提交数据(GET) - JSP 基础教程 | 简单教程(www.twle.cn)</p>

在浏览器上输入

http://localhost:8080/jsp/form.jsp

显示如下

使用表单的 POST 方法范例

一些重要的数据肯定不能使用 GET 方法传递,应该使用 POST 方法传递

现在我们把上面的表单 form.jsp 中的 method 属性改成 "post" 就能使用 POST 方法提交数据了

webapp/form_post.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<meta charset="utf-8">
<title>HTML 表单提交数据(POST) - JSP 基础教程 | 简单教程(www.twle.cn)</title>
<form action="form_get.jsp" method="POST">
站点: <input type="text" name="name">
<br />
网址: <input type="text" name="url" />
<input type="submit" value="提交" />
</form>
<p>HTML 表单提交数据(POST) - JSP 基础教程 | 简单教程(www.twle.cn)</p>

在浏览器上输入

http://localhost:8080/jsp/form_post.jsp

显示如下

JSP 处理 checkbox 数据

HTML 复选框 checkbox 可以传递一个甚至多个数据

现在我们写一个范例来演示 JSP 如何处理 checkbox 数据

webapp/form_checkbox.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<meta charset="utf-8">
<title>HTML checkbox 表单 - JSP 基础教程 | 简单教程(www.twle.cn)</title>
<form action="checkbox.jsp" method="POST">
<input type="checkbox" name="google" checked="checked" /> Google
<input type="checkbox" name="twle"  /> 简单编程
<input type="checkbox" name="taobao" checked="checked" /> 
                                                淘宝
<input type="submit" value="选择网站" />
</form>
<p>HTML checkbox 表单 - JSP 基础教程 | 简单教程(www.twle.cn)</p>

webapp/checkbox.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.io.*,java.util.*" %>
<!DOCTYPE html>
<meta charset="utf-8">
<title>从复选框中读取数据 - JSP 基础教程 | 简单教程(www.twle.cn)</title>
<ul>
<li><p><b>Google 是否选中:</b>
   <%= request.getParameter("google")%>
</p></li>
<li><p><b>简单编程是否选中:</b>
   <%= request.getParameter("twle")%>
</p></li>
<li><p><b>淘宝是否选中:</b>
   <%= request.getParameter("taobao")%>
</p></li>
</ul>
<p>从复选框中读取数据 - JSP 基础教程 | 简单教程(www.twle.cn)</p>

在浏览器上输入

http://localhost:8080/jsp/form_checkbox.jsp

显示如下

JSP 读取所有表单参数

JSP 可以使用 reqeust.getParameterNames() 读取所有表单参数,该方法返回所有变量的名称的枚举

一旦我们有了一个 Enumeration(枚举),我们就可以调用 hasMoreElements() 方法来确定是否还有元素,以及使用nextElement()方法来获得每个参数的名称

webapp/checkbox_all.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.io.*,java.util.*" %>
<!DOCTYPE html>
<meta charset="utf-8">
<title>读取所有 checkbox 提交的数据 - JSP 基础教程 | 简单教程(www.twle.cn)</title>
<style>
    table { border-collapse: collapse; }
    table,th,td {border:1px solid #ddd;}
    th,td {padding:5px 10px;text-align: left}
</style>
<table width="100%" border="1" align="center">
<tr bgcolor="#949494">
<th>参数名</th><th>参数值</th>
</tr>
<%
   Enumeration paramNames = request.getParameterNames();

   while(paramNames.hasMoreElements()) {
      String paramName = (String)paramNames.nextElement();
      out.print("<tr><td>" + paramName + "</td>\n");
      String paramValue = request.getParameter(paramName);
      out.println("<td> " + paramValue + "</td></tr>\n");
   }
%>
</table>
<p>读取所有 checkbox 提交的数据 - JSP 基础教程 | 简单教程(www.twle.cn)</p>

webapp/form_checkbox_all.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<meta charset="utf-8">
<title>HTML checkbox 表单 - JSP 基础教程 | 简单教程(www.twle.cn)</title>
<form action="checkbox_all.jsp" method="POST">
<input type="checkbox" name="google" checked="checked" /> Google
<input type="checkbox" name="twle"  /> 简单编程
<input type="checkbox" name="taobao" checked="checked" /> 
                                                淘宝
<input type="submit" value="选择网站" />
</form>
<p>HTML checkbox 表单 - JSP 基础教程 | 简单教程(www.twle.cn)</p>

在浏览器上输入

http://localhost:8080/jsp/form_checkbox_all.jsp

显示如下

JSP 基础教程

关于   |   FAQ   |   我们的愿景   |   广告投放   |  博客

  简单教程,简单编程 - IT 入门首选站

Copyright © 2013-2022 简单教程 twle.cn All Rights Reserved.