JSP-實驗:表單傳值-提交表單並傳遞、獲取數據
說明: 參考鏈接在最後1
我這個版本運行過,反正沒大問題,但是用參考的那個網頁上的內容,就會出錯……原因也寫在後面了。
實驗
實驗內容:
利用表單傳遞數據,此題目包含01.html、01.jsp、02.jsp、03.jsp、04.jsp共五個程序。
以下圖1-5分別是這5個程序運行後的截圖。編寫程序代碼實現截圖效果。
下載地址(實驗內容/源代碼):
01.html
01.jsp
02.jsp
03.jsp
04.jsp
相關知識
jsp表單form傳值
頁面間鏈接和數據傳遞的三種方式:
(1)通過form將數據提交到下一個頁面;
(2)通過鏈接將數據提交到下一個頁面;
(3)通過Session將數據提交到後續頁面。
session是一次會話只要瀏覽器不關閉就不會關閉會話,一般默認保存30分鐘可以根據自己的需要更改。(關於如何更改,暫時沒有涉及)
源代碼
參考鏈接1
參考鏈接的代碼有部分無法運行,重新修改了。
【備註】只粘貼部分代碼,源代碼自己下載吧。
01.html
<h2>利用表單傳遞數據</h2>
<form name="form1" method="post" action="02.jsp">
<p>你的姓名:
<input type="text" name="name">
</p>
<p>你的愛好:
<input type="text" name="hobby">
</p>
<p>你所從事的行業:
<select name="work">
<option></option> <!--默認爲空,從下拉菜單中選擇-->
<option value="學生">學生</option>
<option value="IT業">IT業</option>
<option value="商業">商業</option>
<option value="製造業">製造業</option>
<option value="服務業">服務業</option>
</select>
</p>
<p>
<input type="Submit" value="提交">
<input type="Reset" value="重置">
</p>
</form>
02.jsp
<p>
<%
//從表單中獲取數據
String name=new String(request.getParameter("name").getBytes("iso-8859-1"), "utf-8");
String hobby=new String(request.getParameter("hobby").getBytes("iso-8859-1"), "utf-8");
String work=new String(request.getParameter("work").getBytes("iso-8859-1"), "utf-8");
%>
<%
//驗證"名字(name)"的長度是否符合要求
if(name.length()<2||name.length()>8)
out.println("你輸入的名字長度不符合要求");
else{
out.println("你的姓名是:"+name+"<br>");
out.println("你的愛好是:"+hobby+"<br>");
out.println("你所從事的工作是:"+work+"<br>");
//將"名字(name)"保存到session對象中,讓後續頁面(下個頁面、下下個頁面、……)引用
session.setAttribute("name",name);
}
%>
<br>
<!--將"愛好(hobby)"和"工作(work)"以鏈接的形式傳遞給下個頁面-->
<a href="03.jsp?hobby=<%=hobby%>&work=<%=work%>">提交</a>
</p>
<hr>
<p><font size="2">*將"名字(name)"保存到session對象中,讓後續頁面(下個頁面、下下個頁面、……)引用</font></p>
<p><font size="2">*將"愛好(hobby)"和"工作(work)"以鏈接的形式傳遞給下個頁面</font></p>
03.jsp
<body>
<p>從session對象中獲取"名字(name)"的值;<br>從鏈接中獲取"愛好(hobby)"和"工作(work)"</p>
<SCRIPT language="JavaScript">
function submit1()
{
document.forms["form1"].action="04.jsp";
document.form1.submit();
}
function edit1()
{
document.forms["form1"].action="01.jsp";
document.form1.submit();
}
</SCRIPT>
<body>
<h3>從session對象中獲取"名字(name)"的值;從鏈接中獲取"愛好(hobby)"和"工作(work)"</h3>
<%
String name=(String)session.getAttribute("name");
String hobby=request.getParameter("hobby");
String work= request.getParameter("work");
out.println("你的姓名是:"+name+"<br>");
out.println("你的愛好是:"+hobby+"<br>");
out.println("你所從事的工作是:"+work+"<br>");
//將"愛好(hobby)"和"工作(work)"保存在session對象中
session.setAttribute("hobby",hobby);
session.setAttribute("work",work);
%>
<form name="form1" method="post">
<input type="hidden" name="name" value="<%=name%>">
<input type="hidden" name="hobby" value="<%=hobby%>">
<input type="hidden" name="work" value="<%=work%>">
<p><h3>確認提交這些信息嗎?</h3></p>
<input type="Button" name="Submit" value="確認" onClick="javascript:submit1()">
<input type="Button" name="Edit" value="修改" onClick="javascript:edit1()">
</form>
<hr>
<p><font size="2">*將"愛好(hobby)"和"工作(work)"保存在session對象中,讓後續頁面(下個頁面、下下個頁面、……)引用</font></p>
<p><font size="2">*由於"名字(name)"在上個頁面中已經保存在session對象中了,這裏沒必要再次保存</font></p>
</body>
04.jsp
<%
//從sessoin對象中獲取數據
String name=(String)session.getAttribute("name");
String work=(String)session.getAttribute("work");
String hobby=(String)session.getAttribute("hobby");
%>
<p>
<font color="#0000FF"><%=name%></font>,你好!你所從事的工作是<font color="#0000FF"><%=work%></font>,在業餘時間喜歡<font color="#0000FF"><%=hobby%></font>。
</p>
01.jsp
<title>利用表單傳遞數據</title>
</head>
<%
String name=new String(request.getParameter("name").getBytes("iso-8859-1"), "utf-8");
String hobby=new String(request.getParameter("hobby").getBytes("iso-8859-1"), "utf-8");
String work=new String(request.getParameter("work").getBytes("iso-8859-1"), "utf-8");
%>
<body>
<h3>利用表單傳遞數據</h3>
<form name="form1" method="post" action="02.jsp">
<p>你的姓名:
<input type="text" name="name" value="<%=name%>">
</p>
<p>你的愛好:
<input type="text" name="hobby" value="<%=hobby%>">
</p>
<p>你所從事的行業:
<select name="work">
<%if(work.equals("學生")){%>
<option value="學生" selected>學生</option>
<option value="IT業">IT業</option>
<option value="商業">商業</option>
<option value="製造業">製造業</option>
<option value="服務業">服務業</option>
<%}else if(work.equals("IT業")){%>
<option value="學生">學生</option>
<option value="IT業" selected>IT業</option>
<option value="商業">商業</option>
<option value="製造業">製造業</option>
<option value="服務業">服務業</option>
<%}else if(work.equals("商業")){%>
<option value="學生">學生</option>
<option value="IT業">IT業</option>
<option value="商業" selected>商業</option>
<option value="製造業">製造業</option>
<option value="服務業">服務業</option>
<%}else if(work.equals("製造業")){%>
<option value="學生">學生</option>
<option value="IT業">IT業</option>
<option value="商業">商業</option>
<option value="製造業" selected>製造業</option>
<option value="服務業">服務業</option>
<%}else if(work.equals("服務業")){%>
<option value="學生">學生</option>
<option value="IT業">IT業</option>
<option value="商業">商業</option>
<option value="製造業">製造業</option>
<option value="服務業" selected>服務業</option>
<%}%>
</select>
</p>
<p>
<input type="Submit" value="提交">
<input type="Reset" value="重置">
</p>
</form>
</body>
遇到的問題
- 部分內容的中文亂碼。
而實際情況是:已經選擇了UTF-8了,雖然一部分正常但還有一部分(也就是提交的那部分內容,明明是中文,但顯示出來的是亂碼)- 原因:tomcat沒有配置好UTF-8
- 剛開始只配置了Eclipse:
JSP-(技巧)Eclipse默認新建文件設置爲適合中文的類型(UTF-8等)——解決中文亂碼問題 - amosC’s - CSDN博客 - 其實還需要配置Tomcat的server.xml文件:
JSP-tomcat設置編碼格式 配置utf-8(以防網頁框以及網頁顯示的時候中文亂碼) - amosC’s - CSDN博客
- 在Eclipse無法運行,然而在瀏覽器上可以運行,完全沒出錯……
- 直接在Eclipse運行之後,複製一下網址再實驗吧……
- 具體就是第一個頁面還可以,第二個也沒問題
- 到了第3個頁面就出錯了
- 報錯內容:
HTTP Status 400 – Bad Request
Type Exception Report
Message Invalid character found in the request target. The valid characters are defined in RFC 7230 and RFC 3986
Description The server cannot or will not process the request due to something that is perceived to be a client error (e.g., malformed request syntax, invalid request message framing, or deceptive request routing).
Exception
java.lang.IllegalArgumentException: Invalid character found in the request target. The valid characters are defined in RFC 7230 and RFC 3986
org.apache.coyote.http11.Http11InputBuffer.parseRequestLine(Http11InputBuffer.java:467)
org.apache.coyote.http11.Http11Processor.service(Http11Processor.java:294)
org.apache.coyote.AbstractProcessorLight.process(AbstractProcessorLight.java:66)
org.apache.coyote.AbstractProtocol$ConnectionHandler.process(AbstractProtocol.java:770)
org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1415)
org.apache.tomcat.util.net.SocketProcessorBase.run(SocketProcessorBase.java:49)
java.util.concurrent.ThreadPoolExecutor.runWorker(Unknown Source)
java.util.concurrent.ThreadPoolExecutor$Worker.run(Unknown Source)
org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61)
java.lang.Thread.run(Unknown Source)
Note The full stack trace of the root cause is available in the server logs.
Apache Tomcat/9.0.11
預覽效果
01 html:
02 jsp:
03 jsp:
04 jsp:
01 jsp:
返回03,點擊“修改”,跳轉到01.jsp
。圖和01.html
的一樣。
既然看到了最後,那就直接給個壓縮包吧,可以直接點擊下載源代碼:
備註:修改了一次,問題不大,然後也就沒有重新上傳源文件了。
//end
其他說明可以點擊簡介查看。
轉載請註明原文章鏈接,並標註作者amosC。
格式如下:來源:(此處附上原文鏈接)
作者:amosC(amoscey)