Javaweb Form表单查询

今天药忘吃喽~ 2022-05-25 02:10 155阅读 0赞

1.表单(form)，是一种可以由用户输入，并提交给服务器端的一个图形界面，有如下性质：

（1）表单中可以输入一些内容，这些输入功能由控件提供，叫做表单元素

（2）表单中一般都有一个按钮负责提交

（3）单击提交按钮，表单元素中的内容会自动提交给服务器端

（4）表单元素放在<form></form>之间

2、表单中主要有以下几种属性：

（1）action=“query.jsp”：表示提交给后台的query.jsp这个文件去处理这个请求。action支持相对路径，也支持绝对路径

（2）method=“post”，默认情况下是get方式，get和post是提交请求的两种方式

这两者的区别请看我的另一篇博客，有详细介绍：[https://www.cnblogs.com/logsharing/p/8448446.html][https_www.cnblogs.com_logsharing_p_8448446.html]

示例：

index.jsp文件代码如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
        <%@ page import="java.text.*"  %>
        <%@ page import="java.util.*"  %>
    <!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=ISO-8859-1">
    <title>Insert title here</title>
    </head>
    <body>
       <input type="text" name="sss"/><br/>
       <form method="get" action="query.jsp">
           输入QQ号
           <input type="text" name="qq"/><br/>
           输入密码
           <input type="text" name="pwd"/><br/>
           <input type="submit" value="提交">
       </form>
    </body>

后台的query.jsp代码如下：

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Insert title here</title>
    </head>
    <body>
    <%
       String qq=request.getParameter("qq");
       String pwd=request.getParameter("pwd"); 
       /* then  do someting...... */
       out.print( qq +" "+ pwd);
    %>
    </body>
    </html>

然后运行tomcat,点击提交按钮，后会返回qq+pwd，如下图：

![20180506132927237][]

注意红框的url：http://localhost:8080/webpro/query.jsp?qq=265489714&pwd=qwerty123

浏览器会自动把form中的输入框的 name和输入值value拼接起来并用&隔开，然后发送给后台服务器，

但是并不包括最上面66666这个输入框，因为这个不在<form></form>中，

然后后台收到消息后就定位到query.jsp来处理请求，并用 String qq=request.getParameter("qq");这样的方式获取输入的信息

然后执行一系列操作，最后返回结果。

[https_www.cnblogs.com_logsharing_p_8448446.html]: https://www.cnblogs.com/logsharing/p/8448446.html
[20180506132927237]: /images/20220525/2525555c77804af0b30d6d1640db1c7f.png