spring mvc 和ajax异步交互完整实例代码

spring MVC 异步交互demo：

1.jsp页面：

<%@ page language="java" contentType="text/html; charset=utf-8"
 pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="js/jquery-2.1.3.js"></script>
<script type="text/javascript" src="js/jquery-2.1.3.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>Insert title here</title>
<script type="text/javascript">
 function ajaxTest(){
  $.ajax({
  data:"name="+$("#name").val(),
  type:"GET",
  dataType: 'json',
  url:"user/login.do",
  error:function(data){
   alert("出错了！！:"+data.msg);
  },
  success:function(data){
   alert("success:"+data.msg);
   $("#result").html(data.msg) ;
  }
  });
 }
</script>
</head>
<body>
 <input type="text" name="name" id="name"/>
 <input type="submit" value="登录" onclick="ajaxTest();"/>
 <div id="result"></div>
</body>
</html>

2.controller：

package xm.zjl.controller; 

import java.io.IOException;
import java.util.HashMap;
import java.util.Map; 

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; 

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody; 

/**
 * 登录controller
 *
 * @author Administrator
 *
 */
@Controller
@RequestMapping("/user/*")
public class LoginController {
 @RequestMapping(value="login.do")
 public @ResponseBody Map<String,Object> login(HttpServletRequest request,HttpServletResponse response) throws IOException{
  System.out.println(request.getParameter("name"));
  Map<String,Object> map = new HashMap<String,Object>(); 

  if(request.getParameter("name").equals("123")){
   System.out.println("城东");
   map.put("msg", "成功");
  }else{
   System.out.println("失败");
   map.put("msg", "失败");
  }
  return map;
 } 

}

3.pom文件：

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
 <modelVersion>4.0.0</modelVersion>
 <groupId>xiaoma</groupId>
 <artifactId>zjl</artifactId>
 <packaging>war</packaging>
 <version>0.0.1-SNAPSHOT</version>
 <name>zjl Maven Webapp</name>
 <url>http://maven.apache.org</url>
 <dependencies>
  <dependency>
   <groupId>junit</groupId>
   <artifactId>junit</artifactId>
   <version>3.8.1</version>
   <scope>test</scope>
  </dependency>
  <dependency>
   <groupId>org.springframework</groupId>
   <artifactId>spring-webmvc</artifactId>
   <version>4.1.0.RELEASE</version>
  </dependency>
  <dependency>
   <groupId>org.springframework</groupId>
   <artifactId>spring-web</artifactId>
   <version>4.1.0.RELEASE</version>
  </dependency>
  <dependency>
   <groupId>com.fasterxml.jackson.core</groupId>
   <artifactId>jackson-databind</artifactId>
   <version>2.5.0</version>
  </dependency>
  <dependency>
   <groupId>commons-beanutils</groupId>
   <artifactId>commons-beanutils</artifactId>
   <version>1.9.2</version>
  </dependency>
  <dependency>
   <groupId>org.codehaus.jackson</groupId>
   <artifactId>jackson-mapper-asl</artifactId>
   <version>1.9.13</version>
  </dependency> 

  <dependency>
   <groupId>org.codehaus.jackson</groupId>
   <artifactId>jackson-core-asl</artifactId>
   <version>1.9.13</version>
  </dependency>
 </dependencies>
 <build>
  <finalName>zjl</finalName>
  <plugins>
   <plugin>
    <groupId>org.mortbay.jetty</groupId>
    <artifactId>jetty-maven-plugin</artifactId>
    <configuration>
     <stopPort>9966</stopPort>
     <stopKey>foo</stopKey>
     <scanIntervalSeconds>0</scanIntervalSeconds>
     <connectors>
      <connector implementation="org.eclipse.jetty.server.nio.SelectChannelConnector">
       <port>8088</port>
       <maxIdleTime>60000</maxIdleTime>
      </connector>
     </connectors>
     <webAppConfig>
      <contextPath>/</contextPath>
     </webAppConfig>
    </configuration>
   </plugin> 

   <plugin>
    <groupId>org.apache.tomcat.maven</groupId>
    <artifactId>tomcat7-maven-plugin</artifactId>
    <version>2.2</version>
    <configuration>
     <port>8088</port>
     <path>/</path>
     <uriEncoding>UTF-8</uriEncoding>
    </configuration>
   </plugin>
  </plugins>
 </build>
</project>

这里注意如果相关json包没有添加到pom.xml文件中会报：406 not acceptable

4.spring-servlet.xml文件：

<beans xmlns="http://www.springframework.org/schema/beans"
 xmlns:context="http://www.springframework.org/schema/context"
 xmlns:p="http://www.springframework.org/schema/p"
 xmlns:mvc="http://www.springframework.org/schema/mvc"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://www.springframework.org/schema/beans
  http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
  http://www.springframework.org/schema/context
  http://www.springframework.org/schema/context/spring-context.xsd
  http://www.springframework.org/schema/mvc
  http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">
  <!-- 启动注解驱动的Spring MVC功能，注册请求url和注解POJO类方法的映射-->
  <mvc:annotation-driven />
  <!-- 启动包扫描功能，以便注册带有@Controller、@Service、@repository、@Component等注解的类成为spring的bean -->
  <context:component-scan base-package="xm.zjl.controller" />
  <!-- 对模型视图名称的解析，在请求时模型视图名称添加前后缀 -->
  <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver" p:prefix="/" p:suffix=".jsp" />
</beans>

5.web.xml文件：

<?xml version="1.0" encoding="UTF-8"?>
<web-app
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xmlns="http://java.sun.com/xml/ns/javaee"
 xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
 xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
 id="WebApp_ID"
 version="3.0">
 <context-param>
  <param-name>contextConfigLocation</param-name>
  <!-- 应用上下文配置文件 -->
  <param-value>/WEB-INF/spring-servlet.xml</param-value>
 </context-param>
 <listener>
  <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
 </listener>
 <!-- 配置spring核心servlet -->
 <servlet>
  <servlet-name>spring</servlet-name>
  <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
  <load-on-startup>1</load-on-startup>
 </servlet>
 <!-- url-pattern配置为/，不带文件后缀，会造成其它静态文件(js，css等)不能访问。如配为*.do，则不影响静态文件的访问 -->
 <servlet-mapping>
  <servlet-name>spring</servlet-name>
  <url-pattern>*.do</url-pattern>
 </servlet-mapping>
</web-app>

这里需要注意的是：

<servlet-mapping>
  <servlet-name>spring</servlet-name>
  <url-pattern>*.do</url-pattern>
 </servlet-mapping>

如果写成：

<servlet-mapping>
  <servlet-name>spring</servlet-name>
  <url-pattern>/</url-pattern>
 </servlet-mapping> 

会提示：$ is not defined错误

记录一下

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。