jquery下的json格式ajax實(shí)現(xiàn)

前言

    ajax大大地方便了前臺(tái)頁面的顯示，提升了用戶體驗(yàn)，提高了資源的利用率。而jquery支持的ajax方法又為ajax的實(shí)現(xiàn)提供了封裝，免去了繁瑣的瀏覽器兼容判斷與response返回?cái)?shù)據(jù)狀態(tài)判斷。

老城網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián),老城網(wǎng)站設(shè)計(jì)制作，有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為老城上1000家提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站建設(shè)公司要多少錢，請(qǐng)找那個(gè)售后服務(wù)好的老城做網(wǎng)站的公司定做！

    jquery的ajax支持String、XML和JSON機(jī)種格式，而隨著現(xiàn)在類庫的不斷完善，現(xiàn)在可以很方便的直接將對(duì)象直接轉(zhuǎn)換成JSON的數(shù)據(jù)格式，返回給前臺(tái)。而前臺(tái)JS也可以將JSON數(shù)據(jù)很方便地再轉(zhuǎn)換成對(duì)象。

    相對(duì)于XML，JSON這種數(shù)據(jù)格式可能直接看上去沒有XML那么清晰，但是其更利于對(duì)其的解析，直接eval即可獲取其對(duì)象，利于編程。

一、實(shí)例 

實(shí)例才是王道，需求如下:

輸入整機(jī)條碼信息，后臺(tái)查詢相關(guān)數(shù)據(jù)（工單號(hào)碼、機(jī)種、工單數(shù)量）并將其自動(dòng)顯示到頁面

jquery下的json格式ajax實(shí)現(xiàn)

采用jquery觸發(fā)整機(jī)條碼的change事件，觸發(fā)時(shí)走如下ajax方法

  1. $.ajax({  
  2. //采用post方式傳遞數(shù)據(jù)
  3.     type: "POST",  
  4. //struts的action請(qǐng)求
  5.     url: "repairinfo!queryorder",
  6.     //傳遞到后臺(tái)的數(shù)據(jù)  
  7.     data:   "machinecode="+$("#machinecode").val(),  
  8. //采用json的方式返回?cái)?shù)據(jù)
  9.     dataType:"json",  
  10. //后臺(tái)返回?cái)?shù)據(jù)后的方法，返回?cái)?shù)據(jù)為result
  11.     success: function(result){  
  12. //通過eval方法后臺(tái)組織的json數(shù)據(jù)可以直接轉(zhuǎn)化為對(duì)象
  13.         var ary = eval(result);  
  14.           
  15. //獲取數(shù)據(jù)時(shí)直接在引號(hào)內(nèi)填寫字段名稱即可
  16.         $("#machinecode").val(ary['machinecode']);  
  17.         $("#orderid").val(ary['orderid']);  
  18.         $("#machine").val(ary['machine']);  
  19.         $("#num").val(ary['num']);  
  20.           
  21.         if(ary['machinecode'] == null || ary['machinecode'] == ""){  
  22.             $("#isflowid").html("此整機(jī)條碼不存在！");  
  23.         }else{  
  24.             $("#isflowid").empty();  
  25.         }  
  26.     }  
  27. }); 

后臺(tái)獲取數(shù)據(jù)轉(zhuǎn)換為json形式返回前臺(tái)

  1. public void queryorder() throws Exception{  
  2.     /** 此處省略如何獲取實(shí)體repairinforshow */    
  3.  
  4.     //將實(shí)體轉(zhuǎn)化為json形式 
  5.     JSONObject json = JSONObject.fromObject(repairinforshow);  
  6.        System.out.println("開始組織repairin"+json.toString());  
  7.              
  8. //運(yùn)用response返回?cái)?shù)據(jù)
  9.     HttpServletResponse response2 = ServletActionContext.getResponse();  
  10.     response2.setCharacterEncoding("UTF-8");  
  11.     response2.setContentType("text/html;charset=utf-8");  
  12.     response2.setHeader("Cache-Control", "no-cache");  
  13.     response2.getWriter().write(json.toString());  
  14. } 

下面是后臺(tái)控制臺(tái)打印出來的json.toString()

  1. 開始組織repairin{"count":"","description":"","errorcode":"","flag":"","id":0,"isreplacekey":"","machine":"I5","machinecode":"L36832-1C37066630","mainboardcode":"","mainboardreason":"","mainboardrepair":"","mainboardrepairman":"","mainboardresult":"","mainboardresultremark":"","num":"123","orderid":"12","reason":"","repair":"","repairman":"","repairtime":null,"result":"","resultremark":"","station":"","testman":"","uploadtime":null}  

 

二、幾個(gè)注意點(diǎn)

1、在后臺(tái)代碼中轉(zhuǎn)化為JSON的方法

如果是要傳遞collection，需要采用JSONArray來轉(zhuǎn)化

  1. JSONArray json = JSONArray.fromObject(testsets); 

轉(zhuǎn)化為json的ArrayList

  1. 開始組織testsets[{"id":1,"machineid":"6","remark":"前測(cè)","testtype":"前測(cè)"},{"id":2,"machineid":"6","remark":"老化","testtype":"老化"},{"id":3,"machineid":"6","remark":"后測(cè)","testtype":"后測(cè)"}]  

2、后臺(tái)轉(zhuǎn)換JSON數(shù)據(jù)用到的jar包

xom-1.1.jar                             json-lib-2.4.jar
ezmorph-1.0.6.jar                   commons-logging-1.1.1.jar
commons-lang-2.5.jar             commons-collections-3.2.1.jar
commons-beanutils-1.8.0.jar


如果是采用maven管理，只要早pom.xml中添加如下代碼即可

  1. <dependency> 
  2.     <groupId>net.sf.json-lib</groupId> 
  3.     <artifactId>json-lib</artifactId> 
  4. </dependency> 

 

 

新聞標(biāo)題：jquery下的json格式ajax實(shí)現(xiàn)
轉(zhuǎn)載來源：http://muchs.cn/article16/ihcigg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供自適應(yīng)網(wǎng)站、網(wǎng)站導(dǎo)航、網(wǎng)站策劃、動(dòng)態(tài)網(wǎng)站、手機(jī)網(wǎng)站建設(shè)、網(wǎng)站改版

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)

商城網(wǎng)站建設(shè)