JSP／Servlet开发——第十一章 Ajax交互扩展

一、 jQuery实现Ajax的方法：

●除了$.ajax()方法之外，jQuery还提供了其余多种更简单的 Ajax 实现方法，如$.get()、$.post()、$.getJSON()、对象.load()等方法；

●$.get()方法：是 jQuery 封装的发送 HTTP GET 请求从服务器加载数据的Ajax方法；   　　语法：$.get( url [, data] [, success] [, dataType] );      　　◆$.get()方法经常使用参数： 参  数 类  型 说      明 url String 必选，规定将请求到哪一个URL，(发送请求的地址) data PlainObject 或 String 可选，规定连同请求发送到服务器的数据 success Function( PlainObject Date，String textStatus, jqXHR  jqxhr ) 可选，请求成功后调用的函数； 参数Date：可选，服务器返回的结果数据； 参数textStatus：可选，描述请求状态的字符串； 参数jqxhr：可选，jqxhr是XMLHttpResult的超集； 若是指定了dataType，则必须提供此参数。若是没有事情须要处理，可使用null或jQuery()空方法做占位符； dataType String 可选，预期服务器返回的数据类型，可用类型包括：XML、HTML、Script、JSON、JSONP、Text；

●$.post()方法：是 jQuery 封装的发送 HTTP POST请求从服务器加载数据的Ajax方法； 　　语法：$.post( url [, data] [, success] [, dataType] );   　　　　◆$.post()方法经常使用的参数： 参  数 类  型 说      明 url String 必选，规定将请求到哪一个URL，(发送请求的地址) data PlainObject 或 String 可选，规定连同请求发送到服务器的数据 success Function(PlainObject Date，String textStatus, jqXHR  jqxhr) 可选，请求成功后调用的函数； 参数Date：可选，服务器返回的结果数据； 参数textStatus：可选，描述请求状态的字符串； 参数jqxhr：可选，jqxhr是XMLHttpResult的超集； 若是指定了dataType，则必须提供此参数。可是可使用null方法做占位符 dataType String 预期服务器返回的数据类型，包括：XML、HTML、Script、JSON、JSONP、Text

●$.getJSON()方法：因为使用Ajax技术实现异步请求时，常常采用JSON数据格式做为相遇内容的载体，为了简化此种状况下的方法调用，jQuery提供了此方法；      语法：$.getJSON( url [, data] [, success] );        ◆$.getJSON()方法经常使用的参数： 参  数 类  型 说      明 url String 必选，规定将请求到哪一个URL，(发送请求的地址) data PlainObject 或 String 可选，规定连同请求发送到服务器的数据 success Function( PlainObject  data, String  textStatus, jqXHR  jqxhr ) 可选，请求成功后调用的函数； 参数Date：可选，服务器返回的结果数据； 参数textStatus：可选，描述请求状态的字符串； 参数jqxhr：可选，jqxhr是XMLHttpResult的超集；  　　　　  ◆注意：$.getJSON()方法只能以GET方式发送请求；

●.load()方法：方对于经过 Ajax 请求直接加载 HTML 内容当前页面的使用场景，jQuery 也提供了 一个 . load()方法做为简易实现。该方法经过发送 Ajax 请求从 　　服务器加载数据并把晌应的数据添加到指定元素中。  　　　　 语法：$( selector ).load( url [, data] [, complete] );    　　　　  ◆.load()方法经常使用的参数： 参  数 类  型 说      明 url String 必选，规定将请求到哪一个URL，(发送请求的地址) data PlainObject 或 String 可选，规定连同请求发送到服务器的数据 complete Function(String  responseText, String  textStatus, jqXHR  jqxhr ) 可选，对每一个匹配的元素设置完内容后都会触发该函数； 参数responseText：可选，服务器返回的结果数据； 参数textStatus：可选，描述请求状态的字符串； 参数jqxhr：可选，jqxhr是XMLHttpResult的超集； 　　◆该方法默认使用 GET 方法发送请求，除非提供的 data 参数是一个对象 , 则使用 POST 方法发送； 　　◆该方法是最简单的从服务器获取数据的 Ajax 方法 , 它几乎与$ .get(url，data，success)方法等价；不一样的是它不是全局函数，而是针对与选择器匹配的元素执行，而且它拥有匿名的回调函数，当求成功后，该方法自动将返回的数据设置为匹配元素的 HTML 内容

●.load ()方法还能够仅加载远程文档的某个部分，经过 url 参数的特殊语法能够实现。url参数中能够经过空格链接决定加载内容的 jQuery 选择器， 　　如如下代码： 　　　　$ ("#result" ) . load (“article.html #starlet"); 　　　jQuery 将会取回 article.html的内容，而后解析返回的文档，查找 id 为 target 的元素。该素连同其内容会被插入:id 为 result 的元素，所取回文档的其余部分则被丢弃；

●注：$.get()、$.post()、$.getJSON()、对象.load()等经常使用 Ajax 方法都是基于$.ajax ()方法封装的，相比于$.ajax ()方法更加简洁、方便。一般状况下，对于通常的Ajax 功能需求使用以上 Ajax 方法便可知足()，若是须要更多的灵活性，可使用$.ajax ()方法指定多参数；

●基于表单数据的Ajax请求： 　　▲jQuery的.serializeArray()方法会从一组表单元素中检测有效控件，将其序列化成由 name 和 value()两个属性构成的 JSON 对象的数组。 　　　　◆其中有效控件的规则以下(检测一组表单元素中的有效控件)： 　　　　　　★没有被禁用 　　　　　　★必须有name属性 　　　　　　★选中的checkbox或radio才是有效的 　　　　　　★只有触发提交事件的submit按钮才是有效的 　　　　　　★file元素不会被序列化

●$.param()： 　　◆jQuery还提供了一种更简便的方式来实现将表单序列化成请求字符串的功能,即对表元素调用.serialize ()方法：$commentlnputs.serialize()方法，实际上，.serialize()方法内部就是使用 $.param()对.serializeArray()作了一个简单包装。对于不须要中间环节的情景，能够更简便地完成表单数据的序列化； 　　◆将由. serializeArray()生成的对象数组序列化成请求字符串的形式：    　　语法：

二、使用 FastJSON生成 JSON 字符串：

●FastJSON简介：FastJSON是一个性能很好的、由Java实现的JSON解析器和生成器，来自阿里巴巴，其代码托管在 GitHub 服务器上，在https://github.com/alibaba/fastjson/releases页面能够找到不一样版本jar文件和源代码下载路径；FastJSON提供了把 Java 对象序列化成 JSON 字符串，以及将 JSON 字符串反序列化获得 Java对象的功能；

●使用FastJSON  API：FastJSON  API的入口类是com.alibaba.fastjson.JSON，基本上经常使用的操做均可以经过该类的静态方法直接完成。 　　◆用于将 Java 对象序列化成 JSON 字符串的经常使用方法以下： 方      法 说      明 public static String toJSONString ( Object object ) 将Java对象序列化成JSON字符串 public static String toJSONString (Object object, boolean prettyFormat ) prettyFormat为true时生成带格式的JSON字符串;  prettyFormat为false，则与toJSONString (Object object)相同； public static String toJSONString ( Object object, SerializerFeature… features ) 能够经过参数features指定更多序列化规则； public static String toJSONStringWithDateFormat (Object object, String dateFormat, SerializerFeature… features ) 能够经过参数dateFormat指定日期类型的输出格式；    ◆枚举类型 SerializerFeature 定义了多种序列化属性：      　　★经常使用属性以下：     枚 举 值 说      明 QuoteFieldNames 输出 JSON 的字段名时加双引号，默认即便用 WriteMapNullValue 输出值为null的字段，默认不输出 WriteNullListAsEmpty 将值为null的List字段输出为[ ] WriteNullStringAsEmpty 将值为null的String字段输出为“” WriteNullNumberAsZero 将值为null的数值字段输出为0 WriteNullBooleanAsFalse 将值为null的Boolean字段输出为false SkipTransientField 忽略transient字段，默认即忽略 PrettyFormat 格式化JSON字符串，默认不格式化      ★eg：序列化时要包含包含值为 null 的字段，数值为 null  输出0，String 为 null 输出“”           String  strJSON = JSON.toJSONString ( javaObject, SerializerFeature.WriteMapNullValue,SerializerFeature.WriteNullNumberAsZero, SerializerFeature.WriteNullStringAsEmpty );

三、 jQuery 让渡$操做符：

●在 jQuery 中，"$“ 符号有着重要的做用；除了 iQuery , 还有其余一些 JavaScript 脚本库也使用'$' 符号，当项目开发中由于某些缘由同时使用了 jQuery 和另外一个一样使用’ $' 符号的脚本库，就会产生冲突。       eg：下面代码Prototype的 $ 会覆盖jQuery的 $ 　　　　<script type="text/javascript" src="../js/jquery-1.12.4.min.js" /> 　　　　<script type="text/javascript" src="../js/prototype.js" /> 　　eg：下面的 jQuery的 $ 会覆盖Prototype的 $ 　　　　<script type="text/javascript" src="../js/prototype.js" /> 　　　　<script type="text/javascript" src="../js/jquery-1.12.4.min.js" />

●为了使jQuery可以与其余一样使用”$”符号的脚本库共同工做, jQuery定义了jQuery.noConflict()方法，放弃对$的使用权，并能够经过返回值指定一个替代符号,以避免与其余脚本库冲突;      eg：jQuery.noConflict(); // 让渡$使用权，后续jQuery代码使用jQuery代替$ 　　　　jQuery( document ).ready( … ); 　　　或者从新指定一个替代符号： 　　　　var  $j = jQuery.noConflict(); // 让渡$使用权，并指定用 $j 代替$ 　　　　$j( document ).ready( … ); 　　◆可是论采用哪一种方式，都会改变 jQuery 的编码风格，不只更加烦琐，并且对于已有 jQuery代码的重用也会产生不利影响；   　　　　eg：建议使用以下代码：

四、总结：