• gradle配置
group 'org.zln.webDemo'

version '1.0-SNAPSHOT'

apply plugin: 'java'

apply plugin: 'jetty'

sourceCompatibility = 1.8

repositories {

    mavenCentral()

}

dependencies {

......

    compile group: 'com.fasterxml.jackson.core', name: 'jackson-databind', version: '2.8.1'

.....

}

注意：jackson-databind 是必须的，否则无法将返回转换成JSON格式

  • 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_3_1.xsd"

         version="3.1">

......

    <!--③ 配置Spring MVC地址映射-->

    <servlet>

        <servlet-name>webDemo</servlet-name>

        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>

        <init-param>

            <param-name>contextConfigLocation</param-name>

            <param-value>/WEB-INF/springServlet/applicationContext-*-servlet.xml</param-value>

        </init-param>

        <load-on-startup>2</load-on-startup>

    </servlet>

    <servlet-mapping>

        <servlet-name>webDemo</servlet-name>

        <url-pattern>*.html</url-pattern>

    </servlet-mapping>

    <servlet-mapping>

        <servlet-name>webDemo</servlet-name>

        <url-pattern>*.do</url-pattern>

    </servlet-mapping>

    <servlet-mapping>

        <servlet-name>webDemo</servlet-name>

        <url-pattern>*.action</url-pattern>

    </servlet-mapping>

    <servlet-mapping>

        <servlet-name>webDemo</servlet-name>

        <url-pattern>*.json</url-pattern>

    </servlet-mapping>

    <welcome-file-list>

        <welcome-file>index.jsp</welcome-file>

    </welcome-file-list>

</web-app>

注意：配置了json也作为请求的后缀，专门用于json来传递数据的Ajax请求

  • 前台界面
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

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

<%

    String homePage = request.getContextPath();

%>

<!DOCTYPE HTML>

<html>

<head>

    <title>Title</title>

    <script type="text/javascript" src="<%=homePage%>/jsLib/jquery-3.1.0.min.js"></script>

    <meta charset="UTF-8"/>

    <script type="text/javascript">

        $(function(){

            $("#bt1").click(function(){

                $.getJSON(

                        "<%=homePage%>/module/ajaxGetTime.json"

                        ,{key:"参数123"}

                        ,function(data){

                            var $timeDiv = $("#time");

                            $timeDiv.html(data.nowTime);

                        }

                )

            })

        })

    </script>

</head>

<body>

    ajax测试首页<br/>

    <input type="button" id="bt1" value="获取当前时间"/><br/>

    <div id="time"></div>

</body>

</html>

注意：请求后缀一定要是json啊（否则又要去配置其他东西了，麻烦）

这里使用了getJSON函数，其他函数如 $.post也行

  • 控制层
    @RequestMapping(value = "/ajaxGetTime.json")

    @ResponseBody

    public Map<String,String> ajaxGetTime(HttpServletRequest request){

        logger.info("获取参数:"+request.getParameter("key"));

        Map<String,String> map = new HashMap<>();

        String timeStr = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date());

        map.put("nowTime",timeStr);

        logger.info("准备传递给前台的数据:"+map);

        return map;

    }
  • Spring MVC 的配置
<?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:p="http://www.springframework.org/schema/p"

       xmlns:mvc="http://www.springframework.org/schema/mvc"

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

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

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

       http://www.springframework.org/schema/context/spring-context-4.1.xsd

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

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

    <!--这个包下的,所有加过特殊注解的类,都被Spring管理-->

    <context:component-scan base-package="org" resource-pattern="**/*Controller.class"/>

    <mvc:annotation-driven/>

    <!--静态资源-->

    <!--<mvc:resources mapping="/css/**" location="/WEB-INF/css/"/>-->

    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"

          p:viewClass="org.springframework.web.servlet.view.JstlView"

          p:prefix="/WEB-INF/jsp/"

          p:suffix=".jsp"/>

</beans>

Spring MVC与jQuery结合使用Ajax技术的更多相关文章

  1. spring mvc 与 jquery ajax

    在 Spring mvc3中,响应.接受 JSON都十分方便. 使用注解@ResponseBody可以将结果(一个包含字符串和JavaBean的Map),转换成JSON. 使用 @RequestBod ...

  2. 比较JSF、Spring MVC、Stripes、Struts 2、Tapestry、Wicket

    2009-06-23 Java Web层框架--JSF.Spring MVC.Stripes.Struts 2.Tapestry和Wicket他们各自的优点和缺点: JSF 优点: ◆Java EE标 ...

  3. 初学者对Spring MVC的认识

    首先是要一定说明的是,这倒是说明是什么?对吧Spring MVC 是SpringFrameWork的后续产品,并且已经融入到Spring Web Flow中同时Spring MVC 分离了控制器,模型 ...

  4. 前端ajax技术之跨域问题解决

    这里我使用jquery框架的ajax技术 <script type="text/javascript" src="Assets/js/jquery.min.js&q ...

  5. spring mvc实现Restful返回xml格式数据

    最近,想在自己的小项目中搭建一个Restful风格的服务接口api,项目用的spring mvc 3,听说spring mvc本身就能十分方便的支持restful的实现,于是查询了下资料,果然非常强大 ...

  6. Spring MVC Controller与jquery ajax请求处理json

    在用 spring mvc 写应用的时候发现jquery传递的[json数组对象]参数后台接收不到,多订单的处理,ajax请求: "}]}]} $.ajax({ url : url, typ ...

  7. spring mvc实现ajax 分页

    使用到的技术: ·spring 3 mvc ·json ·jquery ·java ·mysql 首先,要了解如何在spring mvc中使用json. 以下主要从Dao和View及Controlle ...

  8. 【Spring学习笔记-MVC-5】利用spring MVC框架，实现ajax异步请求以及json数据的返回

    作者:ssslinppp      时间:2015年5月26日 15:32:51 1. 摘要 本文讲解如何利用spring MVC框架,实现ajax异步请求以及json数据的返回. Spring MV ...

  9. Ajax+Spring MVC实现跨域请求（JSONP）JSONP 跨域

    JSONP原理及实现 接下来,来实际模拟一个跨域请求的解决方案.后端为Spring MVC架构的,前端则通过Ajax进行跨域访问. 1.首先客户端需要注册一个callback(服务端通过该callba ...

随机推荐

  1. IOS 偏好设置数据 存 取（Preferences文件夹）

    很多iOS应用都支持偏好设置,比如保存用户名.密码.字体大小等设 置,iOS提供了一套标准的解决方案来为应用加入偏好设置功能 每个应用都有个NSUserDefaults实例,通过它来存取偏好设置 比如 ...

  2. WCF使用地址去调用服务端的方法

    前面的章节已经讲过了WCF的代码和SVC页面的分离,这里是分离后,客户端调用代码如下: try { var myBinding = new BasicHttpBinding(); var myEndp ...

  3. POJ 3469 Dual Core CPU（最小割模型的建立）

    分析: 这类问题的一遍描述,把一些对象分成两组,划分有一些代价,问最小代价.一般性的思路是, 把这两组看成是S点和T点,把划分的代价和割边的容量对应起来求最小割. 把S和可模版tem之间到达关系看作是 ...

  4. 【BZOJ1064】[NOI2008] 假面舞会（图上DFS）

    点此看题面 大致题意:有\(k\)种面具(\(k\)是一个未知数且\(k≥3\),每种面具可能有多个),已知戴第\(i\)种面具的人能看到第\(i+1\)种面具上的编号,特殊的,戴第\(k\)种面具的 ...

  5. ETL工具--DataX3.0实战

    DataX是一个在异构的数据库/文件系统之间高速交换数据的工具,实现了在任意的数据处理系统(RDBMS/Hdfs/Local filesystem)之间的数据交换,由淘宝数据平台部门完成. DataX ...

  6. 题解 P1137 【旅行计划】

    传送门 很显然,每个点的答案是它所有前驱节点的答案加1,即f[i]=max(f[i],f[j]+1); 考虑空间复杂度用邻接表存图,在拓扑排序同时DP就好了 #include<iostream& ...

  7. 委托、事件与Observer设计模式

    范例说明 上面的例子已不足以再进行下面的讲解了,我们来看一个新的范例,因为之前已经介绍了很多的内容,所以本节的进度会稍微快一些: 假设我们有个高档的热水器,我们给它通上电,当水温超过95度的时候:1. ...

  8. C#进阶之全面解析Lambda表达式

    引言 在实际的项目中遇到一个问题,我们经常在网上搜索复制粘贴,其中有些代码看着非常的简洁,比如Lambda表达式,但是一直没有去深入了解它的由来,以及具体的使用方法,所以在使用的时候比较模糊,其次,编 ...

  9. 项目实战8.2-Linux下Tomcat开启查看GC信息

    本文收录在Linux运维企业架构实战系列 转自https://www.cnblogs.com/along21/ 一.开启GC日志 1.在Tomcat 的安装路径下,找到bin/catalina.sh  ...

  10. Nginx认证

    Nginx 的 ngx_http_auth_basic_module模块允许通过使用“HTTP基本认证”协议验证用户名和密码来限制对资源的访问. 配置举例: location / { auth_bas ...