真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯網站制作重慶分公司

SpringMVC環(huán)境下實現的Ajax異步請求(JSON格式數據)

一 環(huán)境搭建

創(chuàng)新互聯建站主營余干網站建設的網絡公司,主營網站建設方案,成都app開發(fā),余干h5小程序設計搭建,余干網站營銷推廣歡迎余干等地區(qū)企業(yè)咨詢

首先是常規(guī)的spring mvc環(huán)境搭建,不用多說,需要注意的是,這里需要引入jackson相關jar包,然后在spring配置文件“springmvc-servlet.xml”中添加json解析相關配置,我這里的完整代碼如下:



	
	
	
		
			
				text/html;charset=UTF-8
				application/json;charset=UTF-8
			
		
		
			
				
					
						
					
				
			
		
	
	
	
		
			
				
			
		
	
	
	
		
		
		
		
		
		
		
			
				atom=application/atom+xml
				html=text/html
				json=application/json
				xml=application/xml
				*=*/*
			
		
	
	
	
	

	
	
	
		
		
		
		
		
	

項目結構:

SpringMVC環(huán)境下實現的Ajax異步請求(JSON格式數據)

注:我這里測試使用的完整jar包:http://pan.baidu.com/s/1dEUwdmL

僅供參考

二 測試實例

(1)在WEB-INF/jsp目錄下新建了一個index.jsp文件,包含了簡單的jQuery的ajax請求,請求數據的格式是JSON,具體代碼如下:

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>




">






jQuery i18n

	$().ready(
			function() {
				$("#sub").click(
						function() {
							var name = $("#username").val();	
							var age = 18;
							var user = {"username":name,"age":age};
							$.ajax({
										url : 'hello.json',
										type : 'POST',
										data : JSON.stringify(user), // Request body 
										contentType : 'application/json; charset=utf-8',
										dataType : 'json',
										success : function(response) {
											//請求成功
											alert("你好" + response.username + "[" + response.age + "],當前時間是:" + response.time + ",歡迎訪問:http://www.zifangsky.cn");
											
										},
										error : function(msg) {
											alert(msg);
										}
									});
						});
			});



	
	
	

(2)一個簡單的model類User,代碼如下:

package cn.zifangsky.controller;

public class User {
	private String username;
	private int age;
	public String getUsername() {
		return username;
	}
	public void setUsername(String username) {
		this.username = username;
	}
	public int getAge() {
		return age;
	}
	public void setAge(int age) {
		this.age = age;
	}
	
}

(3)controller類TestController.java:

package cn.zifangsky.controller;

import java.text.Format;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;

import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;

@Controller
@Scope("prototype")
public class TestController {

	/**
	 * 轉到頁面
	 */
	@RequestMapping(value = "/hello.html")
	public ModelAndView list() {
		ModelAndView view = new ModelAndView("index");
		return view;
	}

	/**
	 * ajax異步請求, 請求格式是json
	 */
	@RequestMapping(value = "/hello.json", method = { RequestMethod.POST })
	@ResponseBody
	public Map hello(@RequestBody User user) {
		// 返回數據的Map集合
		Map result = new HashMap();

		Format format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");

		// 返回請求的username
		result.put("username", user.getUsername());
		// 返回年齡
		result.put("age", String.valueOf(user.getAge()));
		// 返回當前時間
		result.put("time", format.format(new Date()));

		return result;
	}
}

關于具體的執(zhí)行步驟我簡單說一下:

i)項目啟動后,在瀏覽器中訪問:http://localhost:8089/SpringDemo/hello.html,然后會轉到執(zhí)行controller中的list方法,接著會轉到/WEB-INF/jsp/index.jsp(PS:在controller中返回的是邏輯視圖,跟在springmvc-servlet.xml文件中定義的路徑前綴和后綴進行拼接后合成文件的真正路徑)

ii)在index.jsp頁面輸入文字然后點擊按鈕,將會觸發(fā)ajax請求,這個請求會獲取輸入框中的數據和默認的“age”參數拼接成json格式字符串最后提交到“hello.json”這個請求,也就是執(zhí)行controller中的hello方法

iii)hello方法執(zhí)行完畢后會返回一系列數據最后在頁面中顯示出來

(4)效果如下:

SpringMVC環(huán)境下實現的Ajax異步請求(JSON格式數據)


標題名稱:SpringMVC環(huán)境下實現的Ajax異步請求(JSON格式數據)
文章網址:http://weahome.cn/article/pcigsg.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部