Springmvc下的jquery,ajax和json的等技術的運用
阿新 • • 發佈：2017-10-07
springmvc下的jquery ajax和json的等技術的簡單運用
搭建spring mvc環境，導入springmvc開發所需的包
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_2_5.xsd"
id="WebApp_ID" version="2.5">
<welcome-file-list>
<welcome-file>/index.jsp</welcome-file>
</welcome-file-list>
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:/applicationContext.xml</param-value>
</context-param>
<!-- 配置spring啟動listener入口 -->
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<filter>
<filter-name>encodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
<init-param>
<param-name>forceEncoding</param-name>
<param-value>true</param-value>
</init-param>
</filter>
<!-- encoding filter for jsp page -->
<filter-mapping>
<filter-name>encodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<!-- 配置springmvc啟動dispatcherServlet入口 -->
<!-- 中央控制器 -->
<servlet>
<servlet-name>springMVC</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:/spring-mvc.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>springMVC</servlet-name>
<!-- struts習慣使用/*，在springmvc不管用 -->
<url-pattern>/</url-pattern>
</servlet-mapping>
<servlet-mapping>
<!--這裏不加*.js的話，無法通過src=""引用webapp下的文件，其它同理-->
<servlet-name>default</servlet-name>
<url-pattern>*.js</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.css</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.jpg</url-pattern>
</servlet-mapping>
<display-name>Archetype Created Web Application</display-name>
</web-app>
3.===================spring-mvc.xml的內容（我的放在resources目錄下）===================================
<?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:p="http://www.springframework.org/schema/p"
xmlns:mvc="http://www.springframework.org/schema/mvc" xmlns:context="http://www.springframework.org/schema/context"
xmlns:util="http://www.springframework.org/schema/util" xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.2.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.2.xsd
http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.2.xsd
http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4.2.xsd">
<!-- 激活註解模式，如@Controller -->
<mvc:annotation-driven />
<!-- 對包中的類的註解進行掃描，創建Bean及自動依賴註入 -->
<context:component-scan base-package="cn.ys.controller" />
<bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter" />
<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/</value>
</property>
<property name="suffix">
<value>.jsp</value>
</property>
</bean>
</beans>
4.===============編寫一個輸出json格式的Controller（jkson等jar包）======package cn.ys.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
/**
* @author 鄧聰 E-mail:[email protected]
* @version 創建時間：
* 類說明 輸出一個長度為10的json數組
*/
@Controller
public class ShowController {
@ResponseBody//輸出json對象的註解
@RequestMapping ( "/showTime" )
public List<String> showTime() {
SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
String format = simpleDateFormat.format(new Date());
ArrayList<String> strings = new ArrayList<String>();
for (int i=0;i<10;i++){
strings.add(format);
}
return strings;
}
}
5.==================index.jsp=============================<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%--
Created by IntelliJ IDEA.
User: Administrator
Date: 2017/10/6
Time: 19:48
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" >
$(document).ready(function(){
//每秒發送一個請求。
setInterval(function () {
$.ajax({url:"/showTime",success:function(result){
//將返回的json數組（result）的第一個元素添加到id為time的標簽文本中
$("#time").html(result[0].toString());
}});
},1000)
$("#btn1").click(function(){
$.ajax({url:"/showTime",success:function(result){
$("#time").html(result[0].toString());
}});
});
});
</script>
</head>
<body>
<h2>Hello World!</h2><br>
當前系統時間：<div id="time" style="font-size: 36px ;color: red">${ requestScope.time }</div>
<input type="button" id="btn1" value="獲取時間">
</body>
</html>Springmvc下的jquery,ajax和json的等技術的運用