Struts2+JQuery+Json

最新推荐文章于 2022-11-09 09:52:39 发布

凌冰_

最新推荐文章于 2022-11-09 09:52:39 发布

阅读量208

点赞数 1

分类专栏： Struts2

本文链接：https://blog.csdn.net/hlx20080808/article/details/76257148

版权

Struts2 专栏收录该内容

32 篇文章 0 订阅

订阅专栏

结合使用jQuery和Json的操作上来说很方便；

1.方便前台数据的操作。

2.数据体积小，传输快。

3.客户端操纵XML的时候需要创建ActiveX对象，Json则完全就是一个js对象，它不需要创建DOM。

JSP页面

<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="js/all.js"></script>
</head>

<body>
	<!-- 要显示信息的层 -->
	<div id="show"></div>
	<input id="message" type="button" value="获取单个值" />
	<input id="user" type="button" value="获取User对象" />
	<input id="list" type="button" value="获取List对象" />
	<input id="map" type="button" value="获取Map对象" />
</body>
</html>

JS脚本

$(function(){
	//message
	$("#message").click(function(){
		$.getJSON("myx!exeMessage",function(data){
			$("#show").html(data.message).css("color","red");
		});
	});
	
	//user
	$("#user").click(function(){
		$.getJSON("myx!exeUser",function(data){
			$("#show").html(data.user.name+"="+data.user.pass).css("color","red");
		});
	});
	
	
	//list
	$("#list").click(function(){
		$.getJSON("myx!exeList",function(data){
			var htmls="";
			//遍历数据
			$.each(data.lists,function(i,u){
				htmls+=u.name+"="+u.pass+"<p/>";  //累计数据
			});
			//显示数据
			$("#show").html(htmls).css("color","red");
		});
	});
	
	
	//map
	$("#map").click(function(){
		$.getJSON("myx!exeMap",function(data){
			var htmls="";
			//遍历数据
			$.each(data.maps,function(i,u){
				htmls+=u.name+"="+u.pass+"<p/>";  //累计数据
			});
			//显示数据
			$("#show").html(htmls).css("color","red");
		});
	});
	
});

Action

package com.hlx.action;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.hlx.entity.User;
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionSupport;

public class MyAjaxAction extends ActionSupport {

	// setXXX and getXXX
	private String message; // 使用json返回单个值
	private List<User> lists; // 使用josn返回List对象
	private Map<String, User> maps; // 使用json返回Map对象
	private User user; // 使用json返回对象

	public String getMessage() {
		return message;
	}

	public void setMessage(String message) {
		this.message = message;
	}

	public List<User> getLists() {
		return lists;
	}

	public void setLists(List<User> lists) {
		this.lists = lists;
	}

	public Map<String, User> getMaps() {
		return maps;
	}

	public void setMaps(Map<String, User> maps) {
		this.maps = maps;
	}

	public User getUser() {
		return user;
	}

	public void setUser(User user) {
		this.user = user;
	}

	public String exeMessage() throws Exception {
		this.message = "祝福";
		return "message";
	}

	public String exeUser() throws Exception {
		this.user = new User("qq", "12323");
		return "user";
	}

	public String exeList() throws Exception {
		lists = new ArrayList<User>();
		lists.add(new User("aaa", "000"));
		lists.add(new User("ccc", "222"));
		lists.add(new User("ddd", "444"));
		return "list";
	}

	public String exeMap() throws Exception {
		maps = new HashMap<String, User>();
		maps.put("u1", new User("菲菲", "000"));
		maps.put("u2", new User("肥肥", "111"));
		maps.put("u3", new User("妞妞", "222"));
		return "map";
	}
}

struts2.xml文件

<package name="myxx" namespace="/" extends="json-default">
		<action name="myx" class="com.hlx.action.MyAjaxAction">
			<result name="message" type="json"></result>   <!-- 返回单个值的result -->  
			<result name="user" type="json"></result>  <!-- 返回一个对象 -->  
			<result name="list" type="json"></result>  <!-- 返回集合list -->  
			<result name="map" type="json"></result>  <!-- 返回集合map -->  
		</action>
	</package>

显示结果

凌冰_

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Struts2+JQuery+Json

结合使用jQuery和Json的操作上来说很方便；1.方便前台数据的操作。2.数据体积小，传输快。3.客户端操纵XML的时候需要创建ActiveX对象，Json则完全就是一个js对象，它不需要创建DOM。JSP页面 JS脚本$(function(){ //message $("#message"
复制链接

扫一扫

专栏目录