免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP，暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP

首頁

好書

留言交流

下載APP

聯(lián)系客服
AngularJS進(jìn)階(二十七)實(shí)現(xiàn)二維碼信息的集成思路


需求

      實(shí)現(xiàn)生成的二維碼包含訂單詳情信息。

思路

獲取的內(nèi)容數(shù)據(jù)如下:

 

      現(xiàn)在可以獲取到第一級數(shù)據(jù)，第二級數(shù)據(jù)data獲取不到。利用第一級數(shù)據(jù)的獲取方法獲取不到第二級數(shù)據(jù)。


[javascript] view plain copy
 print?
  1. for(i in data){  
  2. alert(i);           //獲得屬性   
  3. if(typeof(data[i]) == "object"){  
  4. var tmp = data[i];  
  5. for(j in tmp){  
  6. alert(tmp[j]);  
  7. }  
  8. }else{  
  9. alert(data[i]);  //獲得屬性值  
  10. }  
  11. }  

      經(jīng)過層層解析，獲取到的數(shù)據(jù)結(jié)構(gòu)如下所示:

 

      經(jīng)過進(jìn)一步的優(yōu)化改進(jìn)，獲取到的數(shù)據(jù)詳情如下所示:

 

      接下來面臨的問題就是:如何實(shí)現(xiàn)兩個(gè)html頁面間傳值？通過搜索,不同頁面之間的傳值方法有:1.地址傳值(get)  2.cookie  3.localstorage  4.sessionStorage  5.flash  6.依賴后端服務(wù)器。根據(jù)不同場景和需求選擇不同方案。

      經(jīng)過自己的多次嘗試，終于在localstorage這條路上走通了。

      但是在二維碼顯示的環(huán)節(jié)上遇到了問題，太大(見下圖左)的話影響布局，太小(見下圖右)的話二維碼無法解析。

              

                         

      自己必須找到一個(gè)折中的辦法，看來得重新布局一下了，原始布局如下所示:

 

      改善的頁面布局如下：

 

核心代碼

js

[javascript] view plain copy
 print?
  1. var tmp;  
  2. var medInfo = "{";  
  3. for(i in data){  
  4. //alert(i);           // 獲得屬性   
  5. var trans;  
  6. //  對獲取信息進(jìn)行篩選  
  7. if(typeof(i) != "undefined" && i != "stat" && i != "merch_uid" && i != "result" && i != "errtext") {  
  8. switch (i) {  
  9.     case "tx_time":  
  10.         trans = "交易時(shí)間";  
  11.         break;  
  12.     case "buy_uid":  
  13.         trans = "購藥者賬號";  
  14.         break;  
  15.     case "buy_addr":  
  16.         trans = "收貨地址";  
  17.         break;  
  18.     case "receiver":  
  19.         trans = "收貨人";  
  20.         break;  
  21.     case "receiver_tel":  
  22.         trans = "收貨人電話";  
  23.         break;  
  24.     case "old_amt":  
  25.         trans = "藥品總價(jià)";  
  26.         break;  
  27.     case "amt":  
  28.         trans = "支付金額";  
  29.         break;  
  30.     case "merch_name":  
  31.         trans = "配送藥店";  
  32.         break;  
  33.     case "msg":  
  34.         trans = "客戶留言";  
  35.         break;  
  36.     case "cnt":  
  37.         trans = "藥品種類";  
  38.         break;  
  39.     case "data":  
  40.         trans = "藥品列表";  
  41.         break;  
  42.     default:  
  43. }  
  44. medInfo += "\"" + trans + "\":";  
  45. if(typeof(data[i]) == "object"){  
  46. tmp = data[i];  
  47. //alert("這是一個(gè)object對象");  
  48. }else{  
  49. //alert(data[i]);  // 獲得屬性值  
  50. medInfo += "\"" + data[i] + "\",\n";  
  51. }  
  52. }  
  53. }  
  54. //alert(tmp.length);  
  55. tag = 1;  
  56. // 獲取二級數(shù)據(jù)(購物車內(nèi)容)  
  57. for(k = 0; k < tmp.length; k++){  
  58. zqy = tmp[k];  
  59. for(j in zqy){  
  60. //alert(j);  
  61. var trans;  
  62. //  對獲取信息進(jìn)行篩選  
  63. switch (j) {  
  64.   case "medcnt":  
  65.     trans = "藥品數(shù)量";  
  66.      break;  
  67.   case "medamt":  
  68.     trans = "金額總計(jì)";  
  69.     break;  
  70.   case "medname":  
  71.     trans = "藥品名稱";  
  72.     break;  
  73.   case "medprice":  
  74.     trans = "藥品價(jià)格";  
  75.     break;  
  76.    case "medid":  
  77.     trans = "藥品ID";  
  78.     break;  
  79.    default:  
  80.          
  81. }  
  82. if(tag == 1){  
  83. medInfo += "\n[\"" + trans + "\":";  
  84. tag = 2;  
  85. }else{  
  86. medInfo += "\"" + trans + "\":";  
  87. }  
  88. //alert(zqy[j]);  
  89. medInfo += "\"" + zqy[j] + "\",\n";  
  90. }  
  91. if(k == tmp.length-1){  
  92. medInfo += "]";  
  93. }else{  
  94. medInfo += "],[";  
  95. }  
  96. }  
  97. medInfo += "}";  
  98. //alert(medInfo);// 最終的訂單詳情  
  99. document.getElementById("sunny").innerHTML = medInfo;  
  100. //alert(document.getElementById("sunny").innerHTML);  
  101. localStorage.setItem('billInfo', medInfo);  

Html js

[javascript] view plain copy
 print?
  1. <script>  
  2.  // 當(dāng)頁面加載的時(shí)候可以調(diào)用某些函數(shù)  
  3.     window.onload = function(){  
  4. //     alert(localStorage.getItem('billInfo'));  
  5. console.log(localStorage.getItem('billInfo'));  
  6.         var a = parent.document.getElementById("sunny");  
  7.         var qrcode = new QRCode(document.getElementById("qrcode"), {  
  8.             width : 96, // 設(shè)置二維碼寬高96  
  9.             height : 96  
  10.         });  
  11.         qrcode.makeCode(localStorage.getItem('billInfo'));  // 默認(rèn)二維碼內(nèi)容  
  12. //    qrcode.makeCode("http://192.168.1.105:8088/lmapp/billInformation.html");  
  13.     };  
  14. </script>  

有圖有真相

掃碼后效果圖

 

參考文獻(xiàn)

1. http://blog.csdn.net/zccst/article/details/6185856

2. http://zhidao.baidu.com/link?url=Jktv0wA9m7BO-K52gozTBHKGetj-dywKAZokiO1FQQ8cvOyVd5iK8Zas9O6YZ_OEg4byCgUI75_53pJ4aPfayRMKebfeyfGXjQPC1ShQTs_

3. http://www.cnblogs.com/wangxiang/p/3332797.html

4. http://blog.csdn.net/happyflyingave/article/details/25415413

5. http://www.jb51.net/article/47692.htm

6. http://my.oschina.net/adamboy/blog/74162

7. http://www.w3school.com.cn/tiy/t.asp?f=html_table_span

8. http://cli.im/text?text37aa640da147831f1126ba0e06e10797 

本站僅提供存儲服務(wù)，所有內(nèi)容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請點(diǎn)擊舉報(bào)。
打開APP，閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
Angularjs接收服務(wù)端的布爾值
棧實(shí)現(xiàn)四則運(yùn)算
舵機(jī)原理與控制
PHP
發(fā)一份比較全的iTunesMobileDevice Error Enum
計(jì)算機(jī)二級
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)！
如果VIP功能使用有故障，
可點(diǎn)擊這里聯(lián)系客服！

聯(lián)系客服