jquery、Ajax、struts的集成

mamaoyuan625

浏览: 176983 次
性别:
来自: 成都

最近访客更多访客>>

kylix1

caichenglong

songwei123

vv404725784

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

jquery

Ajax Struts jQuery JavaScript json

本人在网上使劲的搜索关于Ajax与jquery的集成，始终很难找到一个完整的而且简单的集成方案，而且关于json对象数组，怎样封装，怎样解析，找到的都不尽人意。

在做集成之前要导入的jar包可以在随后下载：

首先见一个web的工程，添加struts的功能，我相信这个不用做演示吧！如果什么是struts你还不知道的话，就只有用servlet了，也可以实现，这里就不做演示了

编写一个页面 index.jsp

<%@ page language="java" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>jquery ajax</title>
		<link rel="stylesheet" type="text/css" media="screen"
			href="screen.css" />
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<script src="jquery.js" type="text/javascript"></script>
		<script src="json.js" type="text/javascript"></script>
		<script language="javascript">
	$(document).ready(function() {
		$("#bt").click( function() {
					
				
				//$.post("send.do?method=query",
						{"account":$("#account").val()},
						//function(data) {					
						//})

这是post请求

下边是ajax请求

						
		$.ajax({
			 type:"post",
		                url:"send.do?method=query2",
		                data: "account="+$("#account").val(),//{"account":$("#account").val()},
		           
		             success:function(data){
		        	   var ul = eval('('+data+')');
		         
		如果传回来的是一个对象数组，当然是json格式的，就可以循环输出。
		      for(var i =0;i<ul.length;i++){
		      	alert(ul[i].name);
		      }

//如果是一个对象 那就更简单了  直接ul.name;就可以了      	             
	         }
	           });	
						
			
		});
	});
</script>
	</head>

	<body>
		<h3 align="center">
			jquery Ajax
		</h3>
		<hr>
		<label>
			请输入用户名 ：
		</label>
		<input id="account" name="account" type="text">
		<input id="bt" name="bt" type="button" value="检测">
		
		<div class="hint">
		</div>
		<p></p>
	</body>
</html>

这是页面的内容，只要稍微理解jquery的就能看懂，还有要导入<script src="jquery.js" type="text/javascript"></script> 这个必须导入
如果要用到其他的方法，可能会导入jquery的其他插件

现在关键的是Action中的写法：

本人采用的是DispatchAction

public ActionForward query2(ActionMapping mapping, ActionForm form,
			HttpServletRequest request, HttpServletResponse response)
			throws Exception {
		response.setContentType("text/html;charset=utf-8");
		PrintWriter out = response.getWriter();
//定义一个User类（失血模型的类）属性只有id age name  和set和get方法
		User u1 = new User();
		u1.setId(1);
		u1.setAge(22);
		u1.setName("MMY");
		User u2 = new User();
		u2.setId(2);
		u2.setAge(90);
		u2.setName("MMM");
		userList.add(u1);
		userList.add(u2);
//如果你传到页面上的是一个实体对象，比如传一个user对象，就用JSONObject 
		JSONObject jo = JSONObject.fromObject(u1);
//如果你要反悔一个对象数组JSONArray
		JSONArray  js = new JSONArray();
		js.add(u1);
		js.add(u2);

		response.setCharacterEncoding("utf-8");
//然后out出去
//		out.println(js.toString());
		out.println(jo.toString());
		out.close();
		return null;
	}
}

struts-config.xml中的配置：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts-config PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 1.2//EN" "http://struts.apache.org/dtds/struts-config_1_2.dtd">

<struts-config>
  <form-beans>
  	<form-bean name="form" type="MyForm"></form-bean>
  </form-beans>
  <action-mappings>
  	<action path="/send"
  			
  			type="com.june.servlet.MyAction"
  			scope="request"
  			parameter="method"
  		>
  				
  			</action>
  </action-mappings>
</struts-config>

ok，这是最简单的效果，目的是先快速的掌握jquery ajax struts的集成，简单的会了，较复杂的就可以思考了

lib.rar (1.7 MB)
下载次数: 624

分享到：

冒泡排序 | Hibernate中拿到session的两种方式

2009-07-25 11:01
浏览 2982
评论(4)
论坛回复 / 浏览 (3 / 6317)
查看更多

4 楼 spp_1987 2010-07-08

看不明白a

3 楼 vip 2010-03-17

谢谢分享，学习ing

2 楼 oolala 2010-02-05

能不能把全部代码都发上来，没有弄出来5555.

1 楼 oolala 2010-02-05

例子很祥细，以前没有用过jquery这下试一下，十分感谢！

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论