【SpringMVC笔记】Ajax 入门（jQuery

常规配置 web.xml 和 applicationContext.xml：

web.xml：

<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns=“http://xmlns.jcp.org/xml/ns/javaee”

xmlns:xsi=“http://www.w3.org/2001/XMLSchema-instance”

xsi:schemaLocation=“http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd”

version=“4.0”>

springmvc

org.springframework.web.servlet.DispatcherServlet

contextConfigLocation

classpath:applicationContext.xml

1

springmvc

/

encoding

org.springframework.web.filter.CharacterEncodingFilter

encoding

/*

applicationContext.xml：记得加 静态资源过滤 和 注解驱动配置。

<?xml version="1.0" encoding="UTF-8"?>

<beans xmlns=“http://www.springframework.org/schema/beans”

xmlns:xsi=“http://www.w3.org/2001/XMLSchema-instance”

xmlns:context=“http://www.springframework.org/schema/context”

xmlns:mvc=“http://www.springframework.org/schema/mvc”

xsi:schemaLocation="http://www.springframework.org/schema/beans

http://www.springframework.org/schema/beans/spring-beans.xsd

http://www.springframework.org/schema/context

https://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc https://www.springframework.org/schema/mvc/spring-mvc.xsd">

<context:component-scan base-package=“com.yusael.controller”/>

mvc:default-servlet-handler/

mvc:annotation-driven/

<bean class=“org.springframework.web.servlet.view.InternalResourceViewResolver”

id=“internalResourceViewResolver”>

编写一个 AjaxController：

@RestController

public class AjaxController {

@RequestMapping(“/ajax1”)

public void ajax1(String name, HttpServletResponse response) throws IOException {

if (“admin”.equals(name)) {

response.getWriter().write(“true”);

} else {

response.getWriter().write(“false”);

}

}

}

编写 index.jsp 测试：

<%@ page contentType=“text/html;charset=UTF-8” language=“java” %>

<%–onblur：失去焦点触发事件–%>

用户名:

Ajax 执行流程

---

Ajax 异步加载数据案例

================================================================================

首先写一个实体类 User：

@Data

@AllArgsConstructor

@NoArgsConstructor

public class User {

private String name;

private int age;

private String sex;

}

在 Controller 中获取一个集合对象，展示到前端页面：

@RequestMapping(“/ajax2”)

public List ajax2() {

List list = new ArrayList<>();

list.add(new User(“zhenyu”, 21, “男”));

list.add(new User(“yusael”, 99, “男”));

list.add(new User(“hahaha”, 18, “女”));

return list; // 由于@RestController注解, 将list转成json格式返回

}

前端页面：ajaxtest.jsp

<%@ page contentType=“text/html;charset=UTF-8” language=“java” %>

姓名 年龄 性别

Ajax 验证用户名密码

===============================================================================

思考一下：我们平时登录时，输入框后面的实时提示是怎么做到的？

Controller：

@RequestMapping(“/ajax3”)

public String ahax3(String name, String pwd) {

String msg = “”;

if (name != null) {

if (“admin”.equals(name)) {

msg = “OK”;

} else {

msg = “用户名有误!”;

}

}

if (pwd != null) {

if (“123456”.equals(pwd)) {

msg = “OK”;

} else {

msg = “密码输入有误!”;

}

}

return msg;

}

前端页面 login.jsp：

<%@ page contentType=“text/html;charset=UTF-8” language=“java” %>

用户名:

密码:

注：记得处理 JSON 乱码！

applicationContext.xml 中加入以下代码：

mvc:annotation-driven

<mvc:message-converters register-defaults=“true”>

</mvc:message-converters>

</mvc:annotation-driven>

获取 百度 接口案例

=============================================================================