Struts2整合jQuery实现Ajax功能
更新时间:2024-03-07 09:36:01 阅读量: 综合文库 文档下载
Struts2 整合jQuery实现Ajax功能
技术领域很多东西流行,自然有流行的道理,这几天用了jQuery,深感有些人真是聪明绝顶,能将那么多技术融合的如此完美。
首先明确个概念:
jQuery是什么:是使用javascript语言开发的,用于满足项目前台各种操作需要的js程序文件。也就是说,jQuery基本上就是个js程序集,基础核心是jQuery.js文件。
? 当然根据不同的版本具体的表现形式: jQuery.1.6.js或者jquery-1.5.1.js
这个是版本号的不同,具体有哪些区别,还没发现。 ? 还有这种形式
jquery-1.5.1.min.js(紧缩格式,取消回车,一行代码) ? 根据应用需求的不同,jQuery 1 引入jQuery
项目中引入jQuery
? 下载jQuery:http://docs.jquery.com/Downloading_jQuery ? 添加核心文件:将核心的jQuery文件复制到项目中。
2 jQuery的Ajax
jQuery的内容非常庞杂,可以解决诸多方面的需求,主要包括:Ajax,页面效果,页面验证。
作为J2ee项目,我主要关注了一下Ajax和页面验证。
jQuery的Ajax很简单,仅仅使用核心文件jQuery.js就可以实现了。对于这个方面的应用,如下网站的介绍最浅显,最直接:http://www.w3school.com.cn/jquery/ w3c够权威吗?呵呵。 函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求。 jQuery.get() 使用 HTTP GET 请求从服务器加载数据。 jQuery.getJSON() 使用 HTTP GET 请求从服务器加载 JSON 编码数据。 jQuery.post() 使用 HTTP POST 请求从服务器加载数据。 有关Ajax的方法有很多,这里只简单研究了三种(其实就一种jQuery.ajax()),其它的都是jQuery.ajax()的简写形式。
具体格式,上述网站说的已经非常清楚了,记住如下格式就可以。
$.ajax({
type: 'POST', //提交方法 url: url, //提交的地址 data: data, //提交的参数 success: success, //成功后,回调的函数名 dataType: dataType //返回的数据类型 }); 示例:
post的示例:使用ajax()的简化格式post()方法:中间有三个参数:url,data(json格式),回调函数(回调函数可以定义在他处,此处仅写函数名)
$.post(\
{ name: \ function(data){
alert(\ });
3 Struts2整合jQuery
Struts2中主要的业务操作都是通过Action来完成的,此时就需要jQuery来访问Struts2的Action。
$.post(\??) 3.1 Login.jsp页面:
? 功能:用户登录,首先需要输入公司标识码:
? 正确:显示对勾; ? 错误:显示红叉; ? jQuery代码:
? HTML:当文本框失去焦点时,触发回调事件。
? 当文本框‘ckey’失去焦点时:调用“checkkey”函数; ? “checkkey”函数分别确定两个信息:
? 异步访问:'getKeyExist'——判断标识是否正确的Action类。
? 参数:{companyKey:$('#ckey').attr('value')},一个以json格式拼写的参
数。
? 注:Json的对象格式:
? 发出异步请求:jQuery.post(url, params, callbackFun);
3.2 Action代码:
传统的Action都是返回String,根据String的不同决定forward到不同的Jsp页面,这给Ajax带来麻烦。我当初还是走了些弯路。
3.2.1 通过Jsp得到回调信息 就是说: Login.jsp Action jQuery.post( ) message.jsp
? Action: private String companyKey; private String remessage; @Override public String execute() throws Exception { String remessage=\ List
? Struts.xml:
? message.jsp:为了保证取得响应信息,jsp文件中只有Jsp指令
<%@ page language=\<%@ taglib prefix=\String path = request.getContextPath(); String basePath =
request.getScheme()+\%>
? 繁琐; ? 上述的方法,在获得响应的信息时,由于是通过一个jsp页面取得,虽然jsp 页面中仅有jsp指令,但是结果仍然会有很多空行,影响取得信息。 3.2.2 Action自主完成响应: 后来发现,Action也可以自主完成响应,不需要Jsp的支持。代码修改如下: ? Action:新建了个方法getKeyExist,不提供返回值。 if(complist.size()>0) remessage=\ \ else remessage=\ \ HttpServletResponse response = ServletActionContext.getResponse(); response.setCharacterEncoding(\ response.getWriter().write(remessage); ? struts.xml:重新建立了无结果result; ? 此时得到的响应就简单干净了很多。 3.2.3 Action响应Json格式信息: 上述方法已经可以得到响应的信息,但是在很多情况下,还需要对响应的结果进行区分,来决定不同的显示效果,此时,响应值就要携带更多的信息,也就是说不是简单的一个字符串,而是一个对象。那么使用Json格式相对来说就比较方便(3.1提到了Json的对象格式)。 } public final void setCompanyKey(String companyKey) { this.companyKey = companyKey; } public final String getRemessage() { return remessage; } ? Action:响应信息改为json格式; if(complist.size()>0){ remessage=\{type:'yes',show:' ? jQuery:回调结果 function callbackFun(data){ eval('json=' + data + ';'); if(json.type=='no'){ $('#ckey').focus(); } $('#warn').html(json.show); }
正在阅读:
华南理工大学2004攻读硕士研究生入学考试计算机专业综合试题07-08
瑞芯RK3288最强GPU技术细节深度分析 - 图文04-05
社区团购产品竞品分析:美团优选、橙心优选、多多买菜、兴盛优选04-08
读书汇报会活动方案04-19
国际法期末考试习题10-18
x431-河南省郑州外国语中学2018届九年级下学期第三次模拟考试化06-21
武汉事业单位招聘06-02
- 多层物业服务方案
- (审判实务)习惯法与少数民族地区民间纠纷解决问题(孙 潋)
- 人教版新课标六年级下册语文全册教案
- 词语打卡
- photoshop实习报告
- 钢结构设计原理综合测试2
- 2014年期末练习题
- 高中数学中的逆向思维解题方法探讨
- 名师原创 全国通用2014-2015学年高二寒假作业 政治(一)Word版
- 北航《建筑结构检测鉴定与加固》在线作业三
- XX县卫生监督所工程建设项目可行性研究报告
- 小学四年级观察作文经典评语
- 浅谈110KV变电站电气一次设计-程泉焱(1)
- 安全员考试题库
- 国家电网公司变电运维管理规定(试行)
- 义务教育课程标准稿征求意见提纲
- 教学秘书面试技巧
- 钢结构工程施工组织设计
- 水利工程概论论文
- 09届九年级数学第四次模拟试卷
- 整合
- Struts2
- 实现
- 功能
- jQuery
- Ajax
- 英语中考复习计划
- 159615 - 省级安全文明工地施工方案
- 关于比的练习题
- 学生自我评价范文简短4篇
- 心理咨询师三级培训计划与大纲
- 中考语文专题二非文学作品阅读(说明文议论文阅读)刷脸时代来临
- 部编版一年级语文下册第3单元集体备课教案
- 总工及分管各岗位职责 - 图文
- 计算机应用基础网络统考试卷及答案2
- 龙虎塘中心幼儿园教师备课表(腾龙园区) - 图文
- 中考英语二轮复习《第9讲阅读理解专题》讲义
- 2018年高考英语二轮复习专题08 动词的时态和语态(讲学案)
- 常见递推数列通项的九种求解方法(1)
- 华侨、华人、华裔的区别
- 有温度有深度尿道炎常与性生活有关尿道炎该注意的日常保健
- 2017-2018学年天津市宝坻区七年级上学期期末数学试卷(有答案)
- 高职院校校园暴力的原因分析和对策
- 实训课程设计 - 图文
- ±0.000以下施工方案
- 江苏省2014届高考地理二轮专题复习 Word版训练 26+3+4选2仿真模