jQuery操作Ajax和Json

jQuery操作Ajax和Json
嗯，自己学SSH和做项目也已有两个月了。

自己今天来整理一下自己在项目中利用jQuery操作过的Ajax和Json。

当时我对于jQuery操作Ajax几乎不怎么了解，但是项目中有需求，所以自己也是必须要去使用，因此现在来详细讲解一下自己在项目中的操作。

功能中，有一个下拉框，里面存储的是服务商的信息，首选项是“--请选择--”，当我选择第一个下拉框中服务商信息之后，后面紧接着将会得到这个选定的服务商下的所有产品。

做一个联动操作。

虽然我不会用jQuery操作Ajax，但是我第一反应就是想到利用这块技术，于是自己就开始查找对应的资料了。

首先，我在Action中，将服务商的信息从数据库查找出来，保存到List集合中，将集合转发到JSP界面上，利用的是struts2标签：
<div>
<s:select name="provider.iscenicid"list="#request.providerList"listKey="i scenicid"
listValue="szcenicname"headerKey=""headerValue="--请选择"
onchange="onChangeOptionScenic(this)"id="scenicType"/></s:select>
<span id="productInfo"></span>
</div>
（ps:其实这个里面，本不应该设置headerKey和headerValue，应该在Action中在List集合中去增加一行再进行操作。

）
中间的span标签就是将要利用jQuery操作Ajax把产品信息增加到span标签里面！
其次，进行jQuery操作Ajax了：
<script>
function onChangeOptionScenic(_this) {
// 获取下拉框中的listKey值
var iscenic =$(_this).val();
// 设置一个变量，来进行下面的操作
var htmltv ="";
// 设置URL地址
var url ="/tips/travelmessage.action";
// Ajax操作开始
$.ajax ({
// 设定URL
url : url,
// 设置提交方式，这里为post
type : "post",
// 设置数据类型为Json
dataType : "json",
// 设置传过去的值的属性名
data : {"iscenicid" : iscenic},
// 成功返回之后的操作方法
success : function(result) {
// 获取Action中传回来的result的值
var json =eval("("+result+")");
// 循环将服务商下的产品以复选框形式拼接出来
for(var i=0; i<json.length; i++) {
// 将产品信息以复选框形式拼接起来
htmltv +="<input type='checkbox' name='productNa me'
value='"+json[i].productId+"'/>"+json[i].prod uctName;
}
// 添加到上面的span标签中
$("#productInfo").val(htmltv);
}
});
}
</script>
最后，将result进行一个映射文件的配置，配置信息如下（根据公司的一些设定而操作）：<action name="travelmessage"class="com.web.system.tips.TravelMessageAction" method="trav elMessage">
<result type="json">
<param name="root">result</param>
</result>
</action>
在TravelMessageAction中，需要将内容返回到result中，部分代码如下：
List productList = travelMessageService.getProductInfo(product);
JSONArray json =new JSONArray().fromObject(productList);
result = json.toString();
return SUCCESS;
至此，一个完整的操作已完成，这就是自己的一点点整理，希望以后有更多的有技术的知识与大家分享！。