JavaScript / jQuery'de $ .param () ters işlevi


122

Aşağıdaki form verildiğinde:

<form>
    <input name="foo" value="bar">
    <input name="hello" value="hello world">
</form>

$.param( .. )Yapıyı, formu serileştirmek için kullanabilirim :

$.param( $('form input') )

=> foo=bar&hello=hello+world

Yukarıdaki Dizeyi JavaScript ile seri halinden nasıl kaldırabilirim ve bir hash geri alabilirim?

Örneğin,

$.magicFunction("foo=bar&hello=hello+world")

=> {'foo' : 'bar', 'hello' : 'hello world'}

Referans: jQuery.param( obj ).


2
Hey, sadece bu yorumu ekliyorum, böylece koda yaptığım güncellemeyi görebiliyorsunuz, eğer onu kullanıyorsanız ... Yanlışlıkla yazdım, böylece sadece ilkini değiştirsin +. Şimdi hepsinin yerini alıyor!
Blixt

Adlı eklentiler var QueryString. Bir tane yaptım ama parametreleri kabul etmiyor, sadece window.location.search'ten okuyor. Parametreleri kabul eden başkalarını hatırlıyorum ...
BrunoLM

1
Bağımlılıkları olmayan NPM modülü olarak yeniden düzenlenmiş jquery BBQ deparam () yöntemi npmjs.com/package/deparam
alexey2baranov

alexey2baranov, deparam () 'ı NPM olmadan bağımlılık olarak yeniden düzenlemeye ne dersiniz? :)
Andrew

Yanıtlar:


62

Sen kullanmalıdır jQuery barbekü 'ın deparam fonksiyonunu. İyi test edilmiş ve belgelenmiştir.


Güzel eklenti! Paylaşım için teşekkürler.
Jonathan

29
: Eğer bütün barbekü eklentiyi edinmek için istemiyorsanız, deparam işlevi bağımsız burada eklentisi olarak ekstre edildi github.com/chrissrogers/jquery-deparam
Felipe Castro

2
Maalesef github sayfası yıllardır herhangi bir güncelleme görmedi ve denediğimde en son jQuery ile uyumlu görünmüyor ... Gerçi ihtiyacım olana benziyor.
pilavdzice

31

Bu, benzer bir şey yapmak için bir süre önce yazdığım bir fonksiyonun biraz değiştirilmiş bir versiyonu.

var QueryStringToHash = function QueryStringToHash  (query) {
  var query_string = {};
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
    pair[0] = decodeURIComponent(pair[0]);
    pair[1] = decodeURIComponent(pair[1]);
        // If first entry with this name
    if (typeof query_string[pair[0]] === "undefined") {
      query_string[pair[0]] = pair[1];
        // If second entry with this name
    } else if (typeof query_string[pair[0]] === "string") {
      var arr = [ query_string[pair[0]], pair[1] ];
      query_string[pair[0]] = arr;
        // If third or later entry with this name
    } else {
      query_string[pair[0]].push(pair[1]);
    }
  } 
  return query_string;
};

1
Tam olarak kabul edilen yanıtla düşündüğüm gibi "bu dizilerle çalışmaz". Çözümünüz gayet iyi çalışıyor.
Robert Koritnik

20

Bu kısa işlevsel yaklaşıma ne dersiniz?

function parseParams(str) {
    return str.split('&').reduce(function (params, param) {
        var paramSplit = param.split('=').map(function (value) {
            return decodeURIComponent(value.replace(/\+/g, ' '));
        });
        params[paramSplit[0]] = paramSplit[1];
        return params;
    }, {});
}

Misal:

parseParams("this=is&just=an&example") // Object {this: "is", just: "an", example: undefined}

1
Bu kabul edilen cevap olmalı, dış bağımlılıklar olmamalı.
Michael Robinson

Basit, güvenilir ve güçlü çözüm. Saygı, efendim.
fmquaglia

5
Yaptığı şey için kesinlikle iyi bir çözüm. Ancak aktarılan diziler veya nesnelerle ilgilenmez. URL field[][]=a&field[0][]=b&field[0][]=c, Object { field[][]: "a", field[0][]: "c" }olması gerektiği yerde işlenir resultobject.field[0] = Array [ "a", "b", "c" ]. Bu, PHP'den beklenen davranıştır. @ JackyLi'nin çözümü bununla ilgileniyor.
cars10m

16

Cevabım:

function(query){
  var setValue = function(root, path, value){
    if(path.length > 1){
      var dir = path.shift();
      if( typeof root[dir] == 'undefined' ){
        root[dir] = path[0] == '' ? [] : {};
      }

      arguments.callee(root[dir], path, value);
    }else{
      if( root instanceof Array ){
        root.push(value);
      }else{
        root[path] = value;
      }
    }
  };
  var nvp = query.split('&');
  var data = {};
  for( var i = 0 ; i < nvp.length ; i++ ){
    var pair = nvp[i].split('=');
    var name = decodeURIComponent(pair[0]);
    var value = decodeURIComponent(pair[1]);

    var path = name.match(/(^[^\[]+)(\[.*\]$)?/);
    var first = path[1];
    if(path[2]){
      //case of 'array[level1]' || 'array[level1][level2]'
      path = path[2].match(/(?=\[(.*)\]$)/)[1].split('][')
    }else{
      //case of 'name'
      path = [];
    }
    path.unshift(first);

    setValue(data, path, value);
  }
  return data;
}

Evet! Evet! Evet! JQuery tarafından bir $ .ajax çağrısında gönderilen parametreleri ayrıştırmam gereken tam da budur. Bu, doğru şekilde iç içe geçmiş karmaları döndürür. Çok teşekkürler Jacky Li!
Pascal Lindelauf

Şimdiye kadarki en iyi çözüm - Oldukça iyi davranıyor ! Ama kullandığımda umduğum şeyi değil JSON.stringify(geturlargs('fld[2][]=2&fld[][]=3&fld[3][]=4&fld[]=bb&fld[]=cc').fld)alırım (PHP'nin bana vereceği budur). {"2":["2"],"3":["4"],"":"cc"}[null,null,[2],[3,4],"bb","cc"]
cars10m

1
Doğru cevap bu ve lütfen diğer cevapları dikkate almayın, düzgün çalışmıyorlar
Andrew

1
Bu cevap, benim özel kullanım durumuma hitap eden tek cevaptır (burada jQuery'nin $ .param'ına iç içe anahtar / değerlere sahip bir nesneyi aktardım, bu, alma sırasında bu değerleri uygun şekilde nemlendirir).
delinear

9

David Dorward'ın cevabını kullanıyorum ve bunun PHP veya Ruby on Rails gibi davranmadığını fark ettim.

1) bir değişken, olduğu []gibi ?choice[]=1&choice[]=12değil , yalnızca ile biten bir dizidir?a=1&a=2

2) birden çok param aynı ada sahip olduğunda, PHP sunucularında olduğu gibi daha sonrakiler öncekilerin yerini alır (Ruby on Rails birinciyi korur ve sonrakileri yok sayar), örneğin ?a=1&b=2&a=3

Yani David'in versiyonunu değiştiriyorum:

function QueryStringToHash(query) {

  if (query == '') return null;

  var hash = {};

  var vars = query.split("&");

  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    var k = decodeURIComponent(pair[0]);
    var v = decodeURIComponent(pair[1]);

    // If it is the first entry with this name
    if (typeof hash[k] === "undefined") {

      if (k.substr(k.length-2) != '[]')  // not end with []. cannot use negative index as IE doesn't understand it
        hash[k] = v;
      else
        hash[k.substr(0, k.length-2)] = [v];

    // If subsequent entry with this name and not array
    } else if (typeof hash[k] === "string") {
      hash[k] = v;  // replace it

    // If subsequent entry with this name and is array
    } else {
      hash[k.substr(0, k.length-2)].push(v);
    }
  } 
  return hash;
};

oldukça kapsamlı bir şekilde test edilmiştir.


Uri spesifikasyonu, a = 1 & a = 2'nin bir dizi olması gerektiğidir. Ruby on Rails ve PHP gerçek spesifikasyona uymaz.
adiktofsugar

Eğer diziye eklenecek satır olmalı hash[k.substr(0, k.length-2)] = [v];vehash[k.substr(0, k.length-2)].push(v);
Baptiste Pernet

Bu, npm aracılığıyla kullanılabilir hale getirilse iyi olurdu
Erik van Velzen

7

Bunun eski bir konu olduğunu biliyorum, ama belki de bununla hala bir ilgisi var?

Jacky Li'nin iyi çözümünden esinlenerek, girdi olarak rastgele dizi ve nesne kombinasyonlarını da dikkate alabilmek amacıyla kendime ait küçük bir varyasyon denedim. PHP'nin bunu nasıl yapacağına baktım ve "benzer" bir şey elde etmeye çalıştım. İşte kodum:

function getargs(str){
   var ret={};
   function build(urlnam,urlval,obj){ // extend the return object ...
    var i,k,o=obj, x, rx=/\[([^\]]*)\]/g, idx=[urlnam.replace(rx,'')];
    while (x=rx.exec(urlnam)) idx.push(x[1]); 
    while(true){
     k=idx.shift();
     if(k.trim()=='') {// key is empty: autoincremented index
       if (o.constructor.name=='Array') k=o.length; // for Array
       else if (o===obj ) {k=null}  // for first level property name
       else {k=-1;                                  // for Object
         for(i in o) if (+i>k) k=+i;
         k++;
       }
     }
     if(idx.length) { 
       // set up an array if the next key (idx[0]) appears to be
       // numeric or empty, otherwise set up an object:
       if (o[k]==null || typeof o[k]!='object') o[k]=isNaN(idx[0])?{}:[]; 
       o=o[k]; // move on to the next level
     }
     else { // OK, time to store the urlval in its chosen place ...
       // console.log('key',k,'val',urlval);                 
       o[k]=urlval===""?null:urlval; break; // ... and leave the while loop.
     } 
    }
    return obj;
   }
   // ncnvt: is a flag that governs the conversion of
   // numeric strings into numbers
   var ncnvt=true,i,k,p,v,argarr=[],
       ar=(str||window.location.search.substring(1)).split("&"),
       l=ar.length;
   for (i=0;i<l;i++) {if (ar[i]==="") continue;
     p=ar[i].split("=");k=decodeURIComponent(p[0]);
     v=p[1];v=(v!=null)?decodeURIComponent(v.replace(/\+/g,'%20')):'';
     if (ncnvt && v.trim()>"" && !isNaN(v)) v-=0;
     argarr.push([k,v]);  // array: key-value-pairs of all arguments
   }
   for (i=0,l=argarr.length;i<l;i++) build(argarr[i][0],argarr[i][1],ret);
   return ret;
}

İşlev str-argument olmadan çağrılırsa window.location.search.slice(1), girdi olarak kabul edilir.

Bazı örnekler:

['a=1&a=2',                               // 1
 'x[y][0][z][]=1',                        // 2
 'hello=[%22world%22]&world=hello',       // 3
 'a=1&a=2&&b&c=3&d=&=e&',                 // 4
 'fld[2][]=2&fld[][]=3&fld[3][]=4&fld[]=bb&fld[]=cc',  // 5
 $.param({a:[[1,2],[3,4],{aa:'one',bb:'two'},[5,6]]}), // 6
 'a[]=hi&a[]=2&a[3][]=7&a[3][]=99&a[]=13',// 7
 'a[x]=hi&a[]=2&a[3][]=7&a[3][]=99&a[]=13'// 8
].map(function(v){return JSON.stringify(getargs(v));}).join('\n')

sonuçlanır

{"a":2}                                    // 1
{"x":{"y":[{"z":[1]}]}}                    // 2
{"hello":"[\"world\"]","world":"hello"}    // 3
{"a":2,"b":null,"c":3,"d":null,"null":"e"} // 4 = { a: 2, b: null, c: 3, d: null, null: "e" }
{"fld":[null,null,[2],[3,4],"bb","cc"]}    // 5 
{"a":[[1,2],[3,4],{"aa":"one","bb":"two"},[5,6]]}  // 6
{"a":["hi",2,null,[7,99],13]}              // 7
{"a":{"0":2,"3":[7,99],"4":13,"x":"hi"}}   // 8

Jacky Li'nin çözümü ise adüz bir nesne olarak dış kabı üretecekti.

{a:{"0":["1","2"],"1":["3","4"],"2":["5","6"]}} // 6: JackyLi's output

getargs() Bu düzeyin bir nesne mi (sayısal olmayan dizin) yoksa bir dizi mi (sayısal veya boş) olacağını belirlemek için herhangi bir düzey için ilk verilen dizine bakar, böylece yukarıda listelenen (no. 6) listedeki çıktıyla sonuçlanır.

Mevcut nesne bir diziyse null, boş konumları temsil etmek için gereken her yere eklenir. Diziler her zaman ardışık olarak numaralandırılır ve 0 tabanlıdır).

Not, örnekte hayır. 8 Boş indisler için "otomatik artırma", şimdi bir dizi değil, bir nesneyle uğraşıyor olsak da, hala çalışıyor.

Test ettiğim kadarıyla , kabul edilen cevapta bahsedilen getargs()Chriss Roger'ın harika jQuery $.deparam() eklentisiyle hemen hemen aynı şekilde davranıyor . Temel fark olduğunu getargsjQuery olmadan çalışır ve bu does ederken nesnelerde AUTOINCREMENT $.deparam()olacak değil bunu:

JSON.stringify($.deparam('a[x]=hi&a[]=2&a[3][]=7&a[3][]=99&a[]=13').a);

sonuçlanır

{"3":["7","99"],"x":"hi","undefined":"13"}

In $.deparam()endeksi []bir olarak yorumlanır undefinedyerine autoincremented sayısal endeksinin.


bu harika işlev için teşekkürler. Bununla birlikte, dizide anahtar olarak sayı kullanırsanız, örneğin '? A [5] [] = x' gibi, nesne oluştururken anahtarın sayı olarak kullanıldığını ve bu nedenle benim durumumda 5 boş eleman oluşturduğunu fark ettim. Sayısal anahtarı dizge olarak ele almalı ve böylece anahtar olarak "5" (tırnak işaretleriyle) ve değer olarak x olan nesneyi oluşturmalıdır. URL'yi '? A ["5"] [] = x' olmaya zorlayabilirim ama bu çirkin ...
Andrew

@Andrew: Bu benim açımdan kasıtlı bir tasarım kararıydı: Hatırladığım kadarıyla, Jack'in çözümü daha çok beklediğiniz şekilde davranacak. o[k]=isNaN(idx[0])?{}:[];Yeni bir nesne için verilen ilk sayısal indeksle karşılaştığımda, bir dizi oluşturma niyetiyle satırı tanıttım. Aksi takdirde genel bir nesne yapacağım. İhtiyaçlarınıza daha iyi uyması için kodun bu bölümünü değiştirmek size kalmıştır. I. e. gibi bir şey o[k]={}hile yapmalı.
arabalar10m

Teşekkürler. PS, işlevinizin ortasında console.log'u kesinlikle kaldırmalısınız;)
Andrew

@Andrew: Teşekkürler, sadece yorum yaptım. Kodu gönderirken gözden kaçırmış olmalı.
arabalar10m

6

Yeni bir jQuery işlevini şu şekilde oluşturabilirsiniz:

jQuery.unparam = function (value) {
    var
    // Object that holds names => values.
    params = {},
    // Get query string pieces (separated by &)
    pieces = value.split('&'),
    // Temporary variables used in loop.
    pair, i, l;

    // Loop through query string pieces and assign params.
    for (i = 0, l = pieces.length; i < l; i++) {
        pair = pieces[i].split('=', 2);
        // Repeated parameters with the same name are overwritten. Parameters
        // with no value get set to boolean true.
        params[decodeURIComponent(pair[0])] = (pair.length == 2 ?
            decodeURIComponent(pair[1].replace(/\+/g, ' ')) : true);
    }

    return params;
};

4
Bu işlevi sevmiyorum. Neden değeri olmayan bir parametre 'true' değerini almalı? Neden boş değil? Bu tasarım kararının çok ince hatalara yol açabileceğini düşünüyorum. Ayrıca, parametrenin 'son' değeri seçmek yerine birden fazla değere sahip olabileceği durumu neden ele almıyorsunuz? David'in gönderdiği çözüm çok daha iyi.
SolutionYogi

4
Öyle trueolduğu bir kontrol edebilirsiniz if (params.redirect)ya da benzer. Aralarında fark yaratmak istiyorsanıztrueVe diğer değer istiyorsanız, kullanırsınız if (params.redirect === true). Bir nulldeğer benim düşünebildiğim hiçbir şekilde yardımcı olmaz. Bunu David gibi yapmamamın nedeni tutarlılığa esneklikten çok değer vermemdi. Onun yöntemiyle, değerin bir dizge mi yoksa değerini kullanmak için bir dizi mi olduğunu kontrol etmem gerekiyor. Benim düşünceme göre, her zaman bir dizge olmalı ( truedeğerin 'true'iyi olduğunu düşündüğüm dönüşümü ) veya her zaman bir dizi olmalıdır. İp seçtim.
Blixt

Bu hesaba göre, params.delete olsaydı, true olarak ayarlanırdı ve ben zararlı bir şey yapacağım. Gördüğünüz gibi, örnek bulmak çok kolay. 'null', hiçbir değerin olmadığını ve kararın arayan kişiye onu nasıl yorumlamak istediğini açıkça belirtir. Birden çok değer hakkında, ona bu şekilde bakın. Yemek yiyerek, arayanlardan birinin neden yalnızca bir değer aldığını VEYA daha sonra gelip kodu değiştirerek hata ayıklamak için zaman harcayacağından emin oluyorsunuz. Diziyi önceden döndürerek, arayan kişi bunları nasıl kullanacağını hemen bilecektir. Bilgiyi atmak asla iyi değildir, IMHO.
SolutionYogi

2
URL ise /abc?delete, için bir giriş olmasını beklerim delete. Bunun nasıl farklı olduğunu anlamıyorum? Bu nedenle diğer kodu nasıl tercih edebileceğinizi bile anlamıyorum, çünkü bu kod değeri 'undefined'daha iyi olmayan dizeye ayarlayacaktır . Ve birden çok değere gelince, bu bir basitlik ve esneklik durumudur. Sorgu dizelerinde birden çok değerin kullanıldığını nadiren görüyorum, ancak bunları istiyorsanız, her zaman 1+ değer içeren bir dizi döndürün. Dönüş türünü asla karıştırmayın; o zaman hata ayıklamak için zaman harcamanız gerekecek çünkü genellikle bir dizge olan şey aniden bir dizi olabilir.
Blixt

Teşekkürler. Gümüş kurşun olduğunu sanmıyorum. Kodunuzu aldım ve biraz değiştirdim, boole değerlerini kaldırdım, dizi parametrelerinin ayrıştırılmasını ekledim. ? foo [] = 1 & foo [] = 2 => foo: [ "1", "2"]
seb

6

Onun sayesinde http://james.padolsey.com/javascript/parsing-urls-with-the-dom/

Oldukça kolay: D

function params_unserialize(p){
var ret = {},
    seg = p.replace(/^\?/,'').split('&'),
    len = seg.length, i = 0, s;
for (;i<len;i++) {
    if (!seg[i]) { continue; }
    s = seg[i].split('=');
    ret[s[0]] = s[1];
}
return ret;}

2
Bu, birden çok seçeneğe sahip seçim kutularında çalışmaz çünkü yalnızca son seçileni korur.
Fernando Fabreti

Maalesef yorumda bahsettiğiniz noktanın ne olduğunu göremiyorum. Burada atıfta bulunulan işlev ?something=1&param2=value2, bir diziye benzer parametrelerle bir URI'yi seri hale getirmek / ayrıştırmaktır . "Birden çok seçenekli seçim kutuları ile çalışma" ile ne demek istiyorsun?
brutuscat

4

İşte sunucu tarafı JScript ASP Classic sayfasında ( demo ) kullandığım JavaScript uygulamam :

// Transforms a query string in the form x[y][0][z][]=1 into {x:{y:[{z:[1]}]}}
function parseJQueryParams(p) {
    var params = {};
    var pairs = p.split('&');
    for (var i=0; i<pairs.length; i++) {
        var pair = pairs[i].split('=');
        var indices = [];
        var name = decodeURIComponent(pair[0]),
            value = decodeURIComponent(pair[1]);

        var name = name.replace(/\[([^\]]*)\]/g, 
            function(k, idx) { indices.push(idx); return ""; });

        indices.unshift(name);
        var o = params;

        for (var j=0; j<indices.length-1; j++) {
            var idx = indices[j];
            var nextIdx = indices[j+1];
            if (!o[idx]) {
                if ((nextIdx == "") || (/^[0-9]+$/.test(nextIdx)))
                    o[idx] = [];
                else
                    o[idx] = {};
            }
            o = o[idx];
        }

        idx = indices[indices.length-1];
        if (idx == "") {
            o.push(value);
        }
        else {
            o[idx] = value;
        }
    }
    return params;
}

Şimdiye kadar iç içe diziler için bulduğum en iyisi
ymakux

3

bunu kullan :

// convert query string to json object
var queryString = "cat=3&sort=1&page=1";

queryString
    .split("&")
    .forEach((item) => {
        const prop = item.split("=");
        filter[prop[0]] = prop[1];
    });

console.log(queryString);

1

Net işlevi gibi davranan bu çözümü buldum HttpUtility.ParseQueryString.

Sonuç olarak, sorgu dizesi parametreleri özelliklerde değer listeleri olarak depolanır, böylece .Net'te qsObj["param"]arama GetValues("param")yapmakla aynı olacaktır .

Umarım beğenmişsindir. JQuery gerekli değildir.

var parseQueryString = function (querystring) {
    var qsObj = new Object();
    if (querystring) {
        var parts = querystring.replace(/\?/, "").split("&");
        var up = function (k, v) {
            var a = qsObj[k];
            if (typeof a == "undefined") {
                qsObj[k] = [v];
            }
            else if (a instanceof Array) {
                a.push(v);
            }
        };
        for (var i in parts) {
            var part = parts[i];
            var kv = part.split('=');
            if (kv.length == 1) {
                var v = decodeURIComponent(kv[0] || "");
                up(null, v);
            }
            else if (kv.length > 1) {
                var k = decodeURIComponent(kv[0] || "");
                var v = decodeURIComponent(kv[1] || "");
                up(k, v);
            }
        }
    }
    return qsObj;
};

İşte nasıl kullanılacağı:

var qsObj = parseQueryString("a=1&a=2&&b&c=3&d=&=e&");

Sonucu konsolda önizlemek için şunu yazın:

JSON.stringify(qsObj)

Çıktı:

"{"a":["1","2"],"null":["","b",""],"c":["3"],"d":[""],"":["e"]}"

1

CSS- Tricks'de güzel bir tek satırlık var ( Nicholas Ortenzio'dan orijinal kaynak ):

function getQueryParameters(str) {
    return (str || document.location.search).replace(/(^\?)/,'').split("&").map(function(n){return n = n.split("="),this[n[0]] = n[1],this}.bind({}))[0];
}

Gerçekten akıllıca olan kısım, anonim işlevin thisnesnesini nasıl kullandığı ve dizedeki her bir sorgu için bir anahtar / değer çifti eklemesidir. Bununla birlikte, iyileştirme için biraz yer var. Aşağıdaki değişikliklerle onu biraz değiştirdim:

  1. Boş dizelerin ve dize olmayan girdilerin işlenmesi eklendi.

  2. URI ile kodlanmış dizeler ( %40-> @, vb.)

  3. document.location.searchGiriş boşken varsayılan kullanım kaldırıldı .

  4. İsim değiştirildi, daha okunaklı hale getirildi, yorumlar eklendi.

function deparam(str) {
    // Uses an empty 'this' to build up the results internally
    function splitQuery(query) {
        query = query.split('=').map(decodeURIComponent);
        this[query[0]] = query[1];
        return this;
    }

    // Catch bad input
    if (!str || !(typeof str === 'string' || str instanceof String))
        return {};

    // Split the string, run splitQuery on each piece, and return 'this'
    var queries = str.replace(/(^\?)/,'').split('&');
    return queries.map(splitQuery.bind({}))[0];
}

1

Bu gerçekten eski bir soru, ama benim geldiğim gibi - bu yazıya başka insanlar da gelebilir ve bu temayı biraz yenilemek istiyorum. Bugün özel çözümler yapmaya gerek yok - URLSearchParams arayüzü var.

var paramsString = "q=URLUtils.searchParams&topic=api";
var searchParams = new URLSearchParams(paramsString);

//Iterate the search parameters.
for (let p of searchParams) {
  console.log(p);
}

Bildiğim tek sınırlama - bu özellik IE / Edge'de desteklenmiyor.


Maalesef, bu tarayıcıyı desteklemeniz gerekirse diye, her zamanki gibi IE tarafından desteklenmiyor.
Lauren

0

Bu benim Coffeescript'teki sürümüm. Şunun gibi url için de çalışır http://localhost:4567/index.html?hello=[%22world%22]&world=hello#/home

getQueryString: (url)->
    return null if typeof url isnt 'string' or url.indexOf("http") is -1

    split = url.split "?"

    return null if split.length < 2 
    path = split[1]

    hash_pos = path.indexOf "#"
    path = path[0...hash_pos] if hash_pos isnt -1

    data = path.split "&"
    ret = {}
    for d in data
      [name, val] = d.split "=" 
      name = decodeURIComponent name
      val = decodeURIComponent val
      try 
        ret[name] = JSON.parse val
      catch error
        ret[name] = val
    return ret

0

Parametreleri yalnızca bir GET isteğinden hızlı bir şekilde almak istiyorsanız, işte basit ve kompakt bir tane:

function httpGet() {
    var a={},b,i,q=location.search.replace(/^\?/,"").split(/\&/);
    for(i in q) if(q[i]) {b=q[i].split("=");if(b[0]) a[b[0]]=
    decodeURIComponent(b[1]).replace(/\+/g," ");} return a;
}

Dönüştürür

something?aa=1&bb=2&cc=3

gibi bir nesneye

{aa:1,bb:2,cc:3}

0

Bir dizi veya nesnenin serileştirilmiş bir temsilini oluşturur (AJAX istekleri için URL sorgu dizesi olarak kullanılabilir).

<button id='param'>GET</button> 
<div id="show"></div>
<script>
  $('#param').click(function () {
    var personObj = new Object();
    personObj.firstname = "vishal"
    personObj.lastname = "pambhar";
    document.getElementById('show').innerHTML=$.param(`personObj`));
  });
</script>
output:firstname=vishal&lastname=pambhar

1
Açıklamasız kod hoş karşılanmaz. Lütfen devam edip kodunuzu açıklayabilir misiniz?
L. Guthardt

Bir dizi veya nesnenin serileştirilmiş bir gösterimini oluşturur (AJAX istekleri için URL sorgu dizesi olarak kullanılabilir)
Vishal Patel

Lütfen açıklamaları düzenleyerek doğrudan yanıtınıza ekleyin. Yine de yorumlarda değil.
L. Guthardt

-1

yanıtlar biraz jQuery elegance kullanabilir:

(function($) {
var re = /([^&=]+)=?([^&]*)/g;
var decodeRE = /\+/g; // Regex for replacing addition symbol with a space
var decode = function (str) {return decodeURIComponent( str.replace(decodeRE, " ") );};
$.parseParams = function(query) {
    var params = {}, e;
    while ( e = re.exec(query) ) {
        var k = decode( e[1] ), v = decode( e[2] );
        if (k.substring(k.length - 2) === '[]') {
            k = k.substring(0, k.length - 2);
            (params[k] || (params[k] = [])).push(v);
        }
        else params[k] = v;
    }
    return params;
};
})(jQuery);

https://gist.github.com/956897 adresinde çatal


-1

JQuery'nin kendi işlevini .serializeArray()( Link ) kullanabilirsiniz . Bu işlev, bir anahtar-değer çifti dizisi döndürür. Sonuç örneği:

[
  { name: "id", value: "1" },
  { name: "version", value: "100" }
]

1
Sorulan bu değildi. Bir dizgiyi hash'e dönüştürmek istiyor. serializeArray bir form alır ve bir dizi döndürür.
Daniel Bang
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.