在jquery中，可以利用“$.ajax”方法，该方法用于执行AJAX（异步HTTP）请求，通常用于其他方法不能完成的请求，语法为“$.ajax([settings])”；其中settings表示配置ajax请求的一系列键值对。

本文操作环境：windows10系统、jquery3.6.0版、Dell G3电脑。

jquery中怎么使用ajax请求

一、以前Ajax请求

Ajax请求的实现分为五个步骤：

1. 创建请求对象
2. 设置与服务器端的连接信息
3. 向服务器发送数据
4. 设置回调函数
5. 接收服务器的响应数据

每次都写这五个步骤显得比较麻烦，所以使用jQuery的方法实现则较为简洁。

二、使用jQuery实现

语法

$.ajax([settings])
settings为配置ajax请求的一系列键值对，具体参数说明如下表（参数来源菜鸟教程）

三、实现步骤

在jsp/html页面编写页面，并且发送ajax请求

用jQuery编写登录和注册的页面，具体代码附在文章最后

以登录功能的实现为例，ajax请求如下：

$.ajax({

    			type : "POST",			//以post方法提交数据给服务器
    			url : "User",				//提交数据到User
    			dataType : "text",		//数据类型
    			data : {
						//传给服务器的数据
    				"name": $("#name").val(),			
    				"password":$("#pwd").val()
    				}
,
    			success:function(msg) {
			//回调函数
    				if(msg =="OK"){
    
    					alert("登录成功！");

    				}

    				else{
    
    					alert("登录失败！");

    				}

    			}
}
    );
    

编写web.xml配置文件

刚刚的url地址User是什么，从哪里来，就是通过这个配置文件告诉计算机的

servlet>
    
		!-- servlet-name相当于是你想要找的文件的一个别名，一般用类名来代替 -->
    
    servlet-name>
    User/servlet-name>
    
    !-- servlet-class 是类的具体位置，不用加.java -->
    
    servlet-class>
    scau.User/servlet-class>
    
  /servlet>
    
  servlet-mapping>
    
  	!-- 这里的servlet-name必须和上面的一致 -->
    
    servlet-name>
    User/servlet-name>
    
    !--自己定义的名称，url写的就是这个 -->
    
    url-pattern>
    /user/url-pattern>
    
  /servlet-mapping>

寻找关系：

编写java类

接受前端传进来的数据，通过编写一个java类接受，处理

public class User extends HttpServlet {

	
	//因为刚刚请求是post，所以用doPost来接受参数
	//如果用get，则用doGet接受参数
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
    
		System.out.println("--------------------------------------------------");
    
		request.setCharacterEncoding("UTF-8");
    
		// 接受前端传进来的数据，即刚刚的data
		String name = request.getParameter("name");
    
		String pwd = request.getParameter("password");
    
		//在控制台输出参数，验证是否正确
		System.out.println("name:"+name);
    
		System.out.println("pwd:"+pwd);
    
		//根据自己的需求处理数据
		//这里没有连接数据库，就假设已经用有一个用户Lee,密码是123，如果输入这个则登录成功，其余则登录失败
		String msg = "";
    
		if (name.equals("Lee") &
    &
 pwd.equals("123")) {
    
			msg = "OK";

		}
 else {
    
			msg = "bad";

		}
    
		//输出结果，看是否是预期结果
		System.out.println("msg:"+msg);
    
		//返回数据给前端
		//设置编码
		response.setContentType("text/html;
    charset=UTF-8");
    
		//创建out对象
		PrintWriter out = response.getWriter();
    		
		//返回msg给前端
		out.write(msg);

	}
}

现在再来看看我们的回调函数

success:function(msg) {
			//msg是刚刚java程序返回的数据
    				if(msg =="OK"){
    	//如果返回OK，则弹出登录成功的页面
    					alert("登录成功！");

    				}

    				else{
    			//其他则弹出登录成功的页面
    					alert("登录失败！");

    				}

    			}
    

三、总结

通过ajax实现前后端交互，主要过程是前端发送请求，后端接受请求，最后数据给前端。使用jQuery可以大大减低代码量，也易于理解。其步骤主要分三大步骤：

1. 编写页面，发送请求
2. 编写web.xml
3. 编写java类