SpringMVC学习10之AJAX初体验和了解

Ajax了解

AJAX = Asynchronous Javascript and XML（异步的 Javascript 和 XML）。AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。Ajax 不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的Web应用程序的技术。 简单示例 1.创建普通Maven项目后，添加web框架 2.配置web.xml配置文件，改为最新的4.0版本

3.在web.xml配置注册DispatcherServlet

   
       springmvc
       org.springframework.web.servlet.DispatcherServlet
       
       
           contextConfigLocation
           classpath:springmvc-servlet.xml
       
       
       1
   

   
   
   
       springmvc
       /
   

4.配置springmvc-servlet.xml配置文件,名称：springmvc-servlet.xml,说明，这里的名称要求是按照官方来的。

加入jackson统一乱码解决，这是SpringMVC自带的！

5.实体类User

package com.shan.pojo;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

@Data
@AllArgsConstructor
@NoArgsConstructor
public class User {

    private String name;
    private int age;
    private String sex;

}

6.编写一个AjaxController

package com.shan.controller;

import com.shan.pojo.User;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

@RestController
public class AjaxController {
    @RequestMapping("/t1")
    public String test(){
        return "hello";
    }

    @RequestMapping("/a1")
    public void ajax1(String name , HttpServletResponse response) throws IOException {
        if ("小黑神".equals(name)){
            response.getWriter().print("true");
        }else{
            response.getWriter().print("false");
        }
    }

    @RequestMapping("/a2")
    public List ajax2(){
        List list = new ArrayList();
        list.add(new User("小黑神1号",13,"男"));
        list.add(new User("小黑神2号",15,"男"));
        list.add(new User("小黑神3号",18,"男"));
        return list; //由于@RestController注解，将list转成json格式返回
    }

    @RequestMapping("/a3")
    public String ajax3(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; //由于@RestController注解，将msg转成json格式返回
    }

}

7.导入jquery ， 可以使用在线的CDN ， 也可以下载导入

8.编写前端页面

index.jsp

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


  
  <%--  在线引用--%>
  <%--下载jquery后导入--%>
  
  <%--  这个是自己琢磨的，也可以引用jquery--%>
  



<%--onblur：失去焦点触发事件--%>
用户名:

login.jsp

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


    
    
    



    用户名:
    


    密码:
    

user.jsp

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


    




    

        
姓名
        
年龄
        
性别
    
    

    

9.配置Tomcat运行

记得将依赖包导入到tomcat中，否则会出现找不到依赖包的错误！！！

Ajax在我们开发中十分重要，一定要学会使用！ 作者有话说

博客创作不易，希望看到这里的读者动动你的小手点个赞，如果喜欢的小伙伴可以一键三连，作者大大在这里给大家谢谢了。