當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
【JavaScript】如何将JS中的数据提交到Servlet服务器中
生活随笔
收集整理的這篇文章主要介紹了
【JavaScript】如何将JS中的数据提交到Servlet服务器中
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
功能
- 用戶可以在form表單中輸入用戶名和密碼
- 點擊“改變用戶名”、“改變密碼”、“改變隱藏值”按鈕后,相應input中的值被改變
- 注意:此處以一個隱藏值,為了證明隱藏值有效,可以點擊“提交一下”按鈕,將表單數據提交到服務器中。
- 從服務器中可以接收到隱藏值,說明隱藏值也有效。
輸出
uname1=張三 upwd1=密碼被改變了 hide1=我是隱藏值思路
本來是要做一個博客查重,目標是:在前端點擊“計算重復率ratio”之后,通過在JS使用Ajax將查重結果顯示在頁面上。
為了提高執行效率,避免提交之后后端再次計算ratio,我打算直接將之前計算過的ratio通過request請求提交到servlet中。
簡單來說,這是一個怎么將JS中的數據臨時存儲,在提交表單的時候提交到Servlet的問題。
一開始在想,怎樣通過js把值保存到pageContext作用域當中,沒有查到相關資料。最后的解決方式是:使用表單中隱藏的input元素,達到臨時存儲的目的。具體步驟是:
- 在最后要提交的表單中添加一個隱藏的input元素
- 在按鈕點擊事件中設置一個JS函數,此JS函數將值放進隱藏的input元素中
- 這樣,在提交表單時,隱藏的值也能被順帶提交到服務器上
前端JSP頁面
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>使用js改變表單內容的測試</title> </head> <body><form name="input" action="TestServlet" method="post">用戶名: <input type="text" id="uname" name="uname"> <br><br>密碼: <input type="text" id="upwd" name="upwd"> <br><br>隱藏值: <input type="hidden" id="hide" name="hide"> <br><br>提交按鈕:<input type="submit" value="提交一下"> <br><br></form><hr><p>點擊下面的按鈕,將調用setValueTest()函數,可以在javascript中改變form表單中的值<p><input type="button" value="改變用戶名 " onclick="changeUname()" /><input type="button" value="改變密碼 " onclick="changeUpwd()" /><input type="button" value="改變隱藏值 " onclick="changeHide()" /><script type="text/javascript">function changeUname() {document.getElementById("uname").value = "用戶名被改變了";}function changeUpwd() {document.getElementById("upwd").value = "密碼被改變了";}function changeHide() {document.getElementById("hide").value = "我是隱藏值";}</script></body> </html>后端Servlet
package servlet;import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;@WebServlet("/TestServlet") public class TestServlet extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println("--------------------------");req.setCharacterEncoding("utf-8");resp.setContentType("text/html;charset=utf-8");String uname1 = (String) req.getParameter("uname");String upwd1 = (String) req.getParameter("upwd");String hide1 = (String) req.getParameter("hide");System.out.println("uname1=" + uname1);System.out.println("upwd1=" + upwd1);System.out.println("hide1=" + hide1);} }總結
以上是生活随笔為你收集整理的【JavaScript】如何将JS中的数据提交到Servlet服务器中的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 【JSP/Servlet】getPara
- 下一篇: 【Java】不需要正则表达式,提取字符串