JavaScript數組到URL編碼字符串

我正在研究網站的數據層，我需要傳遞一個字符串填充來自網站後端的值。JavaScript數組到URL編碼字符串

這裏是可變的我需要通過以下結構：

編碼

>之前：

的transaction_id = 0815/2009; transaction_cid = 54AB; ITEM_ID = 402163045080; item_va 略= 25.20; item_quantity = 1; transaction_id = 0815/2009; transaction_cid = 54AB; item_id = 402163045080; item_va lue = 25.20; item_quantity = 1;

>編碼後：

的transaction_id％3D0815％2F2009％3Btransaction_cid％3D54AB％3Bitem_id％3D40216304 5080％3Bitem_value％3D25.20％3Bitem_quantity％3D1％3Bitem_id％3D847163029054％3Bi tem_value％3D16.81％3Bitem_quantity％3D2

我已成功地創建與這種形式的必要的數據的數組：

「[{ 「的transaction_id」：「233684」，「transaction_cid」：「d2871c13c507583048d8ecf4a16f94c0」，「我 tem_id」：「3524」，「ITEM_VALUE」：「4915.13」，「item_quantity」：「1」} ]'，

但我需要的是數組中的所有這些元素在url編碼的字符串中。

我沒有想法，因爲所有我嘗試似乎無法正常工作。

透過JSON.stringify保持「：」和「」」，使用警報（）或也一同保持「：」而不是高性能

編輯：

例數組：

arr : {key1: 'a', key2:'b', key3:'c'}

非編碼結果：

str : 'key1=a;key2=b;key3=c'

期望的結果：

STR： 'KEY1％物3Da％3Bkey2％3DB％3Bkey3％的3Dc'

來源

2016-06-28 johan855

您展示如何創建數組，會更簡單修復它有 – charlietfl

替換JSON.stringify與encodeURIComponent：

所以，在看上面的例子有一個對象的數組。要分析，我會做：

var params = elementArray[0]; 
var encoded_params = []; 
for (var prop in params){ 
    if (params.hasOwnProperty(prop)) {    
     encoded_params.push(prop+ "=" +encodeURIComponent(params[prop])); 
    } 
} 
var query_string = "?" + encoded_params.join("&");

注：我寧願從一開始就解決這個問題，瓦特/原始字符串您有：

TRANSACTION_ID = 0815/2009; transaction_cid = 54AB; item_id = 402163045080; item_va lue = 25.20; item_quantity = 1;

// break string into components by splitting on `;`: 
var data_as_str = "transaction_id=0815/2009;transaction_cid=54AB;item_id=402163045080;item_va lue=25.20;item_quantity=1;"; 
var raw_params = data_as_str.split(";"); 

// create a new array where we will store our encoded params 
var encoded_params = []; 

// traverse the split string components 
for (var i=0; i<raw_params.length; i++){ 
    var element = raw_params[i]; 

    // check that the element exists 
    // for example, the trailing `;` will create an empty element 
    // which we do not want to include 
    if (!element){ 
     continue; 
    } 

    // split on `=` to get key, value 
    var key = element.split("=")[0]; 
    var value = encodeURIComponent(element.split("=")[1]); 

    // build a new param string and push to clean array 
    encoded_params.push(key+ "=" +value); 
} 

// after loop has completed, join elements 
// in clean array to complete query string 
var query_string = "?" + encoded_params.join("&"); 
alert(query_string);

來源

2016-06-28 16:26:28

嘿喬丹感謝您的答案，但我指定它不起作用 – johan855

這不會創建查詢參數 – charlietfl

嗯 - 也許我誤解了這個問題。在對url進行編碼之後，你是否需要將它們組合成一個查詢字符串？ –

-1

如果你使用jQuery，您可以使用$.param()。如果你不這樣做，你可以遍歷對象的鍵和格式化你的QueryString。在示例中，我使用Object.keys()來獲取密鑰陣列Array.map()以循環訪問密鑰並返回一個新陣列ES6 template String。隨着encodeURIComponent你得到他編碼的QueryString。

var obj = {key1: 'a', key2:'b', key3:'c'}; 
 

 
console.log(encodeURIComponent($.param(obj))); 
 

 
console.log(encodeURIComponent(Object.keys(obj).map(key=>`${key}=${obj[key]}`).join('&')));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

正如其他答案指出，可以從第一個String做到這一點：

var str = "transaction_id=0815/2009;transaction_cid=54AB;item_id=402163045080;item_va lue=25.20;item_quantity=1;transaction_id=0815/2009;transaction_cid=54AB;item_id=402163045080;item_value=25.20;item_quantity=1;"; 
 

 
console.log(encodeURIComponent(str.split(';').filter(a=>a).join('&')));

來源

2016-06-28 16:35:07

JavaScript數組到URL編碼字符串

回答

相關問題