4页面操作。Jquery中已经提供几供ajax请求的方法，如果返回的是json对象，使用jQuery.getJSON(url,[data],[callback])会比较方便，
jQuery.getJSON(url,[data],[callback]) 通过 HTTP GET 请求载入 JSON 数据。
返回值
XMLHttpRequest
参数
url (String) : 发送请求地址。
data (Map) : (可选) 待发送 Key/value 参数。
callback (Function) : (可选) 载入成功时回调函数。
参数部分，浏览器的缓存是以url为标识的，如果url相同会使用缓存中的数据，如果不想使用缓存，可以在参数中加入一个随机数。
jQuery.each(obj,callback)
通用例遍方法，可用于例遍对象和数组
参数
object (Object) : 需要例遍的对象或数组。
callback (Function) : (可选) 每个成员/元素执行的回调函数。
回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。
Jquery操作下拉列表添加选项的方法为: $(“# categoryId”)[0].options.add(option);
页面代码如下（部分）：
<. language="." type="text/." src="/.s/jquery-1.2.2.js"></.>
<. language=".">
function fillChannel(id){
var url = "/book/getAjaxBookChannelList.action";
$.getJSON(url,{ran:Math.random()},function(json){
if(json.strAjaxChannel.length > 0){
var obj = .('(' + json.strAjaxChannel + ')');
$.each(obj,function(i,n){
option = new Option(n,i);
if(i==id)option.selected=true;
document.getElementById("channellistId").options.add(option);
});
option = new Option("全部频道",999);
if(id == 999)option.selected=true;
document.getElementById("channellistId").options.add(option);
}
else{
option = new Option("暂无频道");
document.getElementById("channellistId").options.add(option);
}
}
);
}
function fillCategory(chid,bid){
document.getElementById("categoryId").options.length=1;
var url = "/book/getAjaxBookCategoryListByChannelID.action";
var cid = 0;
if(chid > 0){
cid = chid;
}
else{
cid = document.getElementById("channellistId").value;
}
$.getJSON(url,{channelID:cid,ran:Math.random()}, function(json){
//参数为频道ID及随机数，function(json)为回调函数，其中json为取到的返回数据
if(json.strAjaxCategory.length > 0){
var obj = .('(' + json.strAjaxCategory + ')');//将json文本转化为json对象，以便于遍历
$.each(obj,function(i,n){ //jquery中的遍历方法，
option = new Option(n,i);
if(i==bid)option.selected=true;
document.getElementById("categoryId").options.add(option);
});
option = new Option("全部分类","-3");
if(bid ==-3)option.selected=true;
document.getElementById("categoryId").options.add(option);
//jquery的方法为:$(“# categoryId”)[0].options.add(option);
}
else{
if(cid == 999){
option = new Option("全部分类","-1");
document.getElementById("categoryId").options.add(option);
}
else{
option = new Option("暂无分类");
document.getElementById("categoryId").options.add(option);
}
}
}
);
}
function fillSelect(chid,cid){
fillChannel(chid);
fillCategory(chid,cid);
}
</.>
<body <s:if test="bookCategory.bookchannelId >0">onLoad="fillSelect(<s:property value="bookCategory.bookchannelId"/>,<s:property value="bookCategory.id"/>);"</s:if><s:if test="bookCategory==null">onLoad="fillChannel(0);"</s:if>>
作品类别
<select name="channellistId" id="channellistId" onChange="fillCategory(<s:if test="bookCategory.bookchannelId >0">0,</s:if><s:property value="categoryId"/>);"><option>选择频道</option></select>
<select name="categoryId" id="categoryId"><option>选择分类</option></select>
分享到：
相关推荐
Struts2、JSON和jQuery的集成是Web开发中常见的技术栈，主要目的是为了实现高效的前端交互和后端数据传输。以下是对这些知识点的详细说明： **Struts2** 是一个基于MVC（Model-View-Controller）设计模式的Java Web...
**AjaxStruts2Json实例详解** 在Web开发中，用户界面的实时性和互动性变得越来越重要，这使得异步更新技术如Ajax（Asynchronous JavaScript and XML）被广泛应用。Ajax允许网页在不重新加载整个页面的情况下与...
在这个例子中，`/helloWorld.json`请求会被发送到服务器，Struts2框架会处理这个请求，返回JSON数据，然后jQuery会将接收到的JSON数据解析并显示在页面上。 关于源码方面，你可以查看`src`目录下的Java源代码和`...
### Struts2、JSON与jQuery实现Ajax登录与注册功能详解 在现代Web开发中，实现高效、实时的用户交互已成为核心需求之一。Struts2框架以其强大的MVC架构能力，结合JSON数据交换标准以及jQuery库的灵活性，为构建动态...
这个项目提供了一个完整的示例，展示了如何在Struts2中集成jQuery和JSON，实现AJAX登录验证。对于初学者或者开发者来说，这是一个很好的学习和参考资源，可以帮助理解Struts2、jQuery和AJAX的协同工作方式，以及如何...
### Struts2、JSON、Gson、jQuery与Ajax简单应用详解 #### 一、概述 在Web开发领域，Struts2、JSON、Gson、jQuery和Ajax是几个非常重要的技术，它们各自扮演着不同的角色，但又能够很好地协同工作来构建高效、交互...
在探讨Struts2与jQuery插件的结合时，我们深入分析了如何在Struts2框架中集成并利用jQuery插件来增强Web应用程序的交互性和用户体验。Struts2作为一个流行的Java Web开发框架，提供了一种灵活的方式来构建MVC架构的...
**jQuery与Struts2整合详解** 在Web开发中，jQuery是一个强大的JavaScript库，它极大地简化了JavaScript的使用，使得前端交互更加便捷高效。而Struts2作为一款成熟的MVC框架，广泛应用于Java后端开发，提供了强大的...
【jQuery与Struts2整合详解】 在Web开发中，jQuery是一个强大的JavaScript库，它简化了JavaScript的DOM操作、事件处理和Ajax交互。Struts2是一个流行的Java Web框架，用于构建MVC（Model-View-Controller）架构的...
Struts2通过Struts2-jquery插件或JSON结果类型，支持异步更新，提供更丰富的用户体验。 总的来说，Struts2作为一个成熟的Java web框架，具有丰富的特性和良好的社区支持，为开发者提供了高效且灵活的开发工具，是...
综上所述，这个例子展示了如何使用 Struts2 处理后端逻辑，通过 JSON 将数据传递给前端，然后利用 jQuery 和 AJAX 实现无刷新的交互体验。这种组合在现代 web 开发中非常常见，能够有效提升应用的性能和用户体验。
**jQuery与Struts2整合应用详解** 在Web开发领域，jQuery和Struts2都是不可或缺的工具。jQuery是一款轻量级的JavaScript库，以其简洁的API和强大的功能深受开发者喜爱，而Struts2作为Java企业级应用中的MVC框架，...
在《struts2+ajax详解》这本书中，你将深入学习这两种技术的结合使用，包括配置、Action编写、Ajax请求的处理以及如何在Struts2中返回JSON数据等内容。通过阅读13 struts2.0 & ajax(1).pdf和14 struts2.0 & ajax(2)....
9. **插件体系**：Struts2有一个丰富的插件库，如 strut2-dojo-plugin（提供Dojo库的支持），strut2-jquery-plugin（提供jQuery库的支持），strut2-json-plugin（支持JSON输出），使开发者能方便地集成各种前端库。...
### Struts2.1.8.1与jQuery1.4.2实现JSON数据交互详解 在Web开发领域，Struts2框架因其强大的功能和灵活性而备受开发者青睐。结合jQuery库，能够实现前后端数据的高效交换，特别是通过JSON格式进行数据传输更是常见...