成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

jquery ajax請(qǐng)求參數(shù)和返回?cái)?shù)據(jù)的處理

2bdenny / 1657人閱讀

摘要:處理返回?cái)?shù)據(jù),渲染到頁(yè)面上去。之前的做法也是和上面一模一樣的吧,返回的數(shù)據(jù)是數(shù)據(jù)格式的,然后分別取值賦值給頁(yè)面元素,所以代碼往往是這樣的。如果有什么更好的方案,請(qǐng)指教,謝謝另外摘記一個(gè)表單輸入框中回車自動(dòng)提交的情況和處理方案

剛接觸學(xué)會(huì)用jQuery ajax的時(shí)候,覺(jué)得真東西好神奇,這樣就可以把數(shù)據(jù)取回來(lái)了啊。然后我可以把取回來(lái)的數(shù)據(jù)渲染到頁(yè)面上,一顆賽艇。
之前很早接觸到項(xiàng)目,并不知道怎么優(yōu)雅的去用jquery ajax(現(xiàn)在也不優(yōu)雅);
那個(gè)時(shí)候看別人寫的代碼

$.post("","",...)

也有

$.get("","",...)

還有

$.ajax()

當(dāng)然現(xiàn)在知道點(diǎn),這些寫法都是一個(gè)意思,還是習(xí)慣用$.ajax()寫寫吧。
之前的數(shù)據(jù)處理,發(fā)送數(shù)據(jù)請(qǐng)求(json的數(shù)據(jù)格式),然后自己通過(guò)下面的方式

var request = {};
request.name = $(".name").val();
request.age = $(".age").val();
request.sex = $(".sex").val();
//...

當(dāng)時(shí)表單發(fā)送的參數(shù)項(xiàng)少,所以沒(méi)覺(jué)得什么,到后來(lái)一個(gè)表單很多項(xiàng)數(shù),也這么寫,結(jié)果request就手工寫了好多行,雖然能用吧,但是看看這樣的代碼就覺(jué)著哪里不對(duì)勁吧,至少很不“優(yōu)雅”。
后來(lái),發(fā)現(xiàn)其實(shí)jquery有個(gè)serialize的方法可以序列化表單數(shù)據(jù),可以省事很多。
w3c_jquery_serialize-demo

處理返回?cái)?shù)據(jù),渲染到頁(yè)面上去。
之前的做法也是和上面一模一樣的吧,返回的數(shù)據(jù)是json數(shù)據(jù)格式的,然后分別取值賦值給頁(yè)面元素,所以代碼往往是這樣的。

如果數(shù)據(jù)再多點(diǎn),真的是感覺(jué)略難看。其實(shí)應(yīng)該是有更好的做法的,返回的是一個(gè)json對(duì)象,所以我們可以通過(guò)遍歷對(duì)象的屬性值取到所有值然后依次渲染到頁(yè)面對(duì)應(yīng)元素即可。
對(duì)象遍歷可以用for-in來(lái)寫(有更好的方法來(lái)寫么?)

$.ajax({
    //...
    success:function(result){
        for(var v in result){
            // 如果渲染的元素都是統(tǒng)一的輸入框形式的話,
            $("form").find("input[name="+ v +"]").val(result[v]); 

            // 如果有其他元素 則另外多帶帶校驗(yàn)處理
        }
    }

})

上面name(或者其他tag在頁(yè)面中先寫好,和返回?cái)?shù)據(jù)的屬性一致)。

如果有什么更好的方案,請(qǐng)指教,謝謝!
另外摘記一個(gè)表單輸入框中回車 自動(dòng)提交的情況和處理方案

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/78749.html

相關(guān)文章

  • ajax如何處理服務(wù)器返回3種數(shù)據(jù)格式

    摘要:如果不指定,將自動(dòng)根據(jù)包信息返回或,并作為回調(diào)函數(shù)參數(shù)傳遞。調(diào)用本次請(qǐng)求時(shí)傳遞的參數(shù)要求為類型的參數(shù),請(qǐng)求完成后調(diào)用的回調(diào)函數(shù)請(qǐng)求成功或失敗時(shí)均調(diào)用。由服務(wù)器返回,并根據(jù)參數(shù)進(jìn)行處理后的數(shù)據(jù)。 這篇東西本身是非?;A(chǔ)的,但是經(jīng)常在處理ajax返回值的時(shí)候還是會(huì)犯各種小錯(cuò)誤,所以就想到把這些方法結(jié)合以前寫過(guò)的代碼片段整理一下,方便以后復(fù)習(xí)和使用。另外呢,雖然能搜到很多類似的文檔,但是整理...

    Lin_R 評(píng)論0 收藏0
  • Ajax詳解

    摘要:當(dāng)請(qǐng)求完成后注冊(cè)一個(gè)回調(diào)函數(shù)。該請(qǐng)求是否觸發(fā)全局處理事件如等,請(qǐng)求發(fā)送前的回調(diào)函數(shù),用來(lái)修改請(qǐng)求發(fā)送前,此功能可用來(lái)設(shè)置自定義頭信息,在函數(shù)中返回將取消這個(gè)請(qǐng)求。例如,為請(qǐng)求指定一個(gè)回調(diào)函數(shù)名。即改變回調(diào)函數(shù)的,默認(rèn)就是傳入的整個(gè)對(duì)象。 Ajax Ajax 全稱是 asynchronous javascript and xml,并不是新的編程語(yǔ)言,可以說(shuō)是已有技術(shù)的組合,主要用來(lái)實(shí)現(xiàn)客...

    jokester 評(píng)論0 收藏0
  • jquery ajax 方法封裝說(shuō)明

    摘要:簡(jiǎn)要說(shuō)明前面我寫了一篇方法封裝及文件設(shè)計(jì)文檔,主要用來(lái)說(shuō)明我們?cè)陧?xiàng)目中通常會(huì)對(duì)的方法進(jìn)行進(jìn)一步的封裝處理,便于我們?cè)跇I(yè)務(wù)代碼中使用。這篇文檔我們主要對(duì)封裝的方法進(jìn)行一個(gè)簡(jiǎn)要說(shuō)明。 簡(jiǎn)要說(shuō)明 前面我寫了一篇《jquery ajax 方法封裝及 api 文件設(shè)計(jì)》文檔,主要用來(lái)說(shuō)明我們?cè)陧?xiàng)目中通常會(huì)對(duì) jquery 的 ajax 方法進(jìn)行進(jìn)一步的封裝處理,便于我們?cè)跇I(yè)務(wù)代碼中使用。從那篇文...

    z2xy 評(píng)論0 收藏0
  • 原生JS與jQuery對(duì)AJAX實(shí)現(xiàn)

    摘要:原生與對(duì)的實(shí)現(xiàn)一定義里這么解釋異步的和。二原生實(shí)現(xiàn)所有現(xiàn)代瀏覽器以及均內(nèi)建對(duì)象。一般是正常未找到頁(yè)面,一般是錯(cuò)誤,或者后臺(tái)沒(méi)有創(chuàng)建相應(yīng)的內(nèi)部服務(wù)錯(cuò)誤,多為后臺(tái)錯(cuò)誤。基本上通過(guò)發(fā)送的數(shù)據(jù)及傳回的數(shù)據(jù)就能定位問(wèn)題所在了。 原生JS與jQuery對(duì)AJAX的實(shí)現(xiàn) 一、定義 W3C里這么解釋AJAX: AJAX = Asynchronous JavaScript and XML(異步的 Jav...

    Chaz 評(píng)論0 收藏0
  • jQuery Ajax應(yīng)用與常用插件

    jQuery 實(shí)現(xiàn)Ajax應(yīng)用 使用load()方法異步請(qǐng)求數(shù)據(jù) 使用load()方法通過(guò)Ajax請(qǐng)求加載服務(wù)器中的數(shù)據(jù),并把返回的數(shù)據(jù)放置到指定的元素中,它的調(diào)用格式為: load(url,[data],[callback]) 參數(shù)url為加載服務(wù)器地址,可選項(xiàng)data參數(shù)為請(qǐng)求時(shí)發(fā)送的數(shù)據(jù),callback參數(shù)為數(shù)據(jù)請(qǐng)求成功后,執(zhí)行的回調(diào)函數(shù) 使用getJSON()方法異步加載JSON格式數(shù)...

    bingchen 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<