javaee ajax提交表单

在下，杨江河

于 2023-06-22 20:21:56 发布

阅读量362

点赞数

分类专栏： Mac开发文章标签： ajax java-ee servlet

本文链接：https://blog.csdn.net/Rockandrollman/article/details/131343960

版权

Mac开发专栏收录该内容

294 篇文章 3 订阅

订阅专栏

该代码示例展示了如何用JavaScript库jQuery通过Ajax方式处理表单提交。当用户点击按钮时，表单数据被序列化并发送到名为FormServlet的Servlet，Servlet接收到数据后处理并返回响应。

摘要由CSDN通过智能技术生成

js



$(function(){
	
	$(":button[name='sub']").click(function(){
		
		$data=$("#regForm").serialize();//序列化表单
		
		$.ajax({
			type:"post",
			url:"FormServlet",
			data:$data,
			success:function(msg){
				alert(msg);
			}
			
			
		})
		
		
	})
})

html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="js/jquery1.11.3.min.js"></script>
<script src="js/form.js"></script>

</head>
<body>

<form id="regForm" action="" method="post">
   用户名:<input type="text" name="uname" />
  密码:<input type="password" name='pwd' />
 <input type='button' name='sub' value='提交' />
</form>


</body>
</html>

servlet

package com.wowowo.ajax;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class FormServlet
 */
@WebServlet("/FormServlet")
public class FormServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public FormServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		//response.getWriter().append("Served at: ").append(request.getContextPath());
		
		request.setCharacterEncoding("utf-8");
		response.setContentType("text/html;charset=utf-8");
		PrintWriter out = response.getWriter();	
		
		String uname=request.getParameter("uname");
		
		String pwd=request.getParameter("pwd");
		
		out.println("接收到了客户端提交的:"+uname+","+pwd);		
		
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}