Jquery客户端脚本使用说明书.docxVIP

 PAGE \* MERGEFORMAT 21 JQuery 客户端脚本框架使用说明书 制作人制作时间修改人修改时间修改内容版本于浩2011-8-26V1.0 一 简介 jQuery确实是一个挺好的轻量级的JS框架，能帮助我们快速的开发JS应用，并在一定程度上改变了我们写JavaScript代码的习惯。 当然jQuery本身包含很多东西，例如说对事件的处理、对Ajax的处理、以及对UI的处理等很多很多的内容；同时利用开发的插件也包含很多类别，例如导航类、分页类、提示框类、编辑器类、表格类、验证类、图表类、Form相关类、上传类、事件日期类、虚拟键盘类等等。 此处所封装的内容十分有限，甚至有些内容只是介绍了相关的用法。如想了解JQuery更多的知识，请参考相关资料。 JQuery框架主要包含三部分内容： 1：JQuery Ajax的使用。 2：JQUery 校验框架的使用。 3：JQuery 文件上传。 版本： 《JQuery 1.5.1》 。 二 具体内容分析 2.1 ajax的使用 由于对JQuery Ajax部分未作任何封装，所以在使用jQuery时只需要引入jquery-1.5.1.min.js即可。这里只对ajax的使用做简单的介绍。关于ajax的使用请大家注意三点： 1：get方式请求最好加上时间戳，以免浏览器缓存对请求造成的影响。 2：如果请求的字符串中含有中文字符，在某些浏览器下是否会出现中文乱码。 由于不同工程的编码方式不一致，以及浏览器的多样性，在这里很难提供一种完全解决方案，对于出现的具体问题，需要具体的解决方案。 3：post方式请求参数的值应该通过对应的取值方式获取，(例如struts1系列通过form内封装属性，给予set、get方法。然后在action中取值。Struts2需要在action中提供属性与set、get方法。). 2.1.1 $.ajax 的用法 形式：jQuery.ajax([options]) HTML内容： input type=button id=ddd name=ddd value=ajax测试 /JavaScript内容： script type=text/javascript $(#ddd).click(function(event) { $.ajax( { type : POST, url : %=path%/ajaxCheck.action, data : name=Johnlocation=Boston, success : function(msg) { alert(Data Saved: + msg); } }); }); /scriptAjaxCheckAction内容： 一：获取参数内容 System.out.println(name+request.getParameter(name)); System.out.println(location+request.getParameter(location)); 二：向客户端写内容： Writer writer = ServletActionContext.getResponse().getWriter(); //struts2 需要首先获取HttpServletResponse。其他情况只要获取此对象即可。 writer.write(向客户端写的内容); //向客户端写的内容即为msg。 success : function(msg) { alert(Data Saved: + msg); }注：此方法也包含一些其他参数此处不做说明。可参考《JQuery1.5.1 中文API》。 2.1.2 load的用法 形式：load(url, [data], [callback]) Html内容： input type=button id=testLoad name=testLoad value=load测试 / div id=divResult/divJavascript内容： $(#testLoad).click(function(event) { $(#divResult).load(%=path%/ajaxCheck.action?name=nihaolocation=shenyang, { resultType : html }, function(responseText, textStatus, XMLHttpRequest) { alert(responseText + responseText); alert(textStatus + te