課件jquery和ajaxajax工作流程

Jquery和AjaxAjax簡(jiǎn)介

Ajax：異步刷新技術(shù)Ajax工作流程

Ajax：異步刷新技術(shù)Ajax技術(shù)的核心Ajax技術(shù)主要開(kāi)發(fā)語(yǔ)言封裝請(qǐng)求或響應(yīng)的數(shù)據(jù)格式修改頁(yè)面元素、改變樣式，實(shí)現(xiàn)局部刷新XMLHttpRequest對(duì)象JSON語(yǔ)法第4頁(yè)/共35頁(yè)JSON：瀏覽器和服務(wù)器交換數(shù)據(jù)的輕量級(jí)對(duì)象對(duì)象的語(yǔ)法：{key:value,key:value,……}，如：{"name":"張三","age":30,"wife":null};數(shù)組的語(yǔ)法：[value,value,……]，如：["中國(guó)","美國(guó)","俄羅斯"]

[{“name”:“張三”,“age”:30},{“name”:“李四,"age":40}]jQuery+Struts

2+JSON

實(shí)現(xiàn)Ajax發(fā)送請(qǐng)求接收請(qǐng)求，處理請(qǐng)求，發(fā)回響應(yīng)接收響應(yīng)，更新局部網(wǎng)頁(yè)Ajax運(yùn)行的基本流程：jQuery

實(shí)現(xiàn)Ajax

請(qǐng)求$.ajax({url:"getData",type:

"post",data:

{"name":"admin"},dataType:"json",success:function(data){//省略了請(qǐng)求成功后執(zhí)行的操作},error:function(data){//省略了請(qǐng)求失敗后執(zhí)行的操作}});請(qǐng)求的<action>提交的數(shù)據(jù),使用JSON

表示接收的結(jié)果類(lèi)型$.ajax()方法：實(shí)現(xiàn)Ajax響應(yīng)<action

name="getData"

class="action.DataAction"method="getData"><result

type="json"><param

name="includeProperties"

></result></action>響應(yīng)Ajax請(qǐng)求的<action>配置以JSON格式發(fā)送結(jié)果設(shè)置Action中需要發(fā)送的屬性name,user.*</param>把Action中的name屬性、user對(duì)象中的所有屬性發(fā)送給客戶(hù)端關(guān)鍵步驟導(dǎo)入struts2-json-plugin-xxx.jar在struts.xml中定義package并繼承json-default指定<result>的type屬性指定為“json”JSON類(lèi)型的Result

2-1struts.xml關(guān)鍵代碼：<package

name="josn_default"

namespace="/"

extends="json-default"><action

name="loginAction"

class="......"

method="execute"

><!--type屬性指定為“json”，將返回序列化的JSON格式數(shù)據(jù)--><result

type="json"><param

name="root">result</param><param

name="includeProperties"></param><param

name="excludeProperties">user.password</param><param

name="excludeNullProperties

">true</param></result></action></package>參數(shù)說(shuō)明串講：JSON類(lèi)型的Result

2-2參數(shù)作用默認(rèn)值適用場(chǎng)景root指定要序列化的根對(duì)象當(dāng)前Actin中所有有返回值的getter方法的值用于指定不需要序列化key值的數(shù)據(jù)includeProperties指定根對(duì)象中要序列化的屬性當(dāng)前根對(duì)象中的所有屬性用于需要序列化的屬性較少的情況excludeProperties指定根對(duì)