js_參數的get傳輸,從一個頁面到另外一個頁面。


2017年10月31日,今天是萬聖節,歡樂谷搞事情。

剛接觸前端那會是分不清,前端和后台的,后台的數據如何傳輸到前端的。

現在用的還是Jquery的ajax請求后台數據到前端頁面的,需要學習的地方還有很多,任重而道遠也。

前后端分離,你是如何定義的呢?我現在公司現在用的php后台語言,現在逐步轉型到Java,在此記錄一點點變化,用作后面追憶

歲月的時候,可以作為回憶的印記。

技術:

 1 <!DOCTYPE html>
 2 <html>
 3 
 4     <head>
 5         <meta charset="UTF-8">
 6         <title></title>
 7     </head>
 8 
 9     <body>
10         <p>如果你瀏覽器的URL是:http://127.0.0.1:8020/web-demo/demodemo/data02.html?id=88&topId=66&artId=6868&findId=999</p>
11     </body>
12     <script type="text/javascript">
13         //1.通過下面封裝對方法,查詢對應對參數
14         var id = getQueryString("id");
15         var topId = getQueryString("topId");
16         var artId = getQueryString("artId");
17         var findId = getQueryString("findId");
18         //2.封裝的一個函數對URL后面的參數進行查詢,可以直接復制在項目中使用
19         function getQueryString(name) {
20             var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
21             var r = window.location.search.substr(1).match(reg);
22             if(r != null) return unescape(r[2]);
23             return '';
24         };
25         //3.在控制台打印對應對參數
26         console.log(id); //88
27         console.log(topId); //66
28         console.log(artId); //6868
29         console.log(findId); //99
30     </script>
31 
32 </html>

我們從一個頁面到另外一個頁面的時候,有時候需要帶一個參數過去,加以區分,這個時候就需要用到URL后面把參數帶過去。

http://127.0.0.1:8020/web-demo/demodemo/data02.html?id=88&topId=66&artId=6868&findId=999
例如上面這個鏈接,我們只需要在鏈接最后通過?xxx=&xxx=&xxx=這樣的方式把參數通過URL傳遞到另外一個頁面,注意?xxx=只能只能出現一次,后面的參數我們通過&xxx=傳遞;
其中xxx為你傳遞的參數。
參數帶過去,我們可以通過下面的函數把它提取出來:
1 function getQueryString(name) {
2             var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
3             var r = window.location.search.substr(1).match(reg);
4             if(r != null) return unescape(r[2]);
5             return '';
6         };
上面這個方法只能提前數字和字母,不能提起中文。在后續傳遞中文的過程中,無法把參數給提取出來。經過研究,可以使用另外一種方法,既可以提取中文也可以提取英文。

 1 getQueryStringZH: function() {
 2             var url = window.location.search; //獲取url中"?"符后的字串   
 3             var theRequest = new Object();
 4             if(url.indexOf("?") != -1) {
 5                 var str = url.substr(1);
 6                 strs = str.split("&");
 7                 for(var i = 0; i < strs.length; i++) {
 8                     //就是這句的問題
 9                     theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
10                     //之前用了unescape()
11                     //才會出現亂碼  
12                 }
13             }
14             return theRequest;
15         },

注意你提起出來的是一個對象,需要通過提起對象的參數而獲得參數。

var getRequest = common.getQueryStringZH();

var companyName = getRequest.companyName;

 



然后你就可以在文檔中,隨意使用了。

 

 





免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM