Soru JavaScript'te sorgu dizesi değerlerini nasıl alabilirim?


Eklenti almanın daha az yolu var mı sorgu dizesi jQuery (veya olmadan) üzerinden değerler?

Öyleyse nasıl? Değilse, bunu yapabilir bir eklenti var mı?


2703


Menşei


Eklentiyi kullanıyorum getURLParam tarif edilmek jQuery-Plugin - getUrlParam (sürüm 2). - coma
bir düz javascript RegEx olmadan çözüm: css-tricks.com/snippets/javascript/get-url-variables - Lorenzo Polidori
Sorunun en iyi çözümü, jQuery'nin gerekmediği mükemmel gözleminden dolayı popülerliğini hak etmesine rağmen, yeni düzenli ifadeler oluşturma ve istenen her parametre için sorgu dizisini yeniden ayrıştırma yöntemi son derece verimsizdir. Çok daha verimli (ve çok yönlü) çözümler uzun süredir var olmuştur, örneğin bu makalede burada yeniden basılmıştır: htmlgoodies.com/beyond/javascript/article.php/11877_3755006_3/... - Joseph Myers
olası kopyası JavaScript sorgu dizesi
Joseph, "jQuery'nin gerekli olmadığı mükemmel gözlem"? Tabi buna gerek yok. JQuery'nin her şeyi yapar, JavaScript'i kullanır. Kullanıcılar jQuery'yi kullanmaz, çünkü JavaScript'in yapamadığı şeyler yapar. JQuery noktası kolaylıktır. - Vladimir Kornea


Cevaplar:


Bu amaçla jQuery'ye ihtiyacınız yoktur. Sadece bazı saf JavaScript kullanabilirsiniz:

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

Kullanımı:

// query string: ?foo=lorem&bar=&baz
var foo = getParameterByName('foo'); // "lorem"
var bar = getParameterByName('bar'); // "" (present with empty value)
var baz = getParameterByName('baz'); // "" (present with no value)
var qux = getParameterByName('qux'); // null (absent)


Not: Bir parametre birkaç kez varsa (?foo=lorem&foo=ipsum), ilk değeri alacaksınız (lorem). Bu konuda bir standart yoktur ve kullanımları değişebilir, örneğin bu soruya bakın: Yinelenen HTTP GET sorgu anahtarlarının yetkili konumu.
NOT: Bu işlev büyük / küçük harfe duyarlıdır. Büyük / küçük harf duyarlı olmayan parametre adı tercih ederseniz, RegExp için 'i' değiştiricisini ekle


Bu yeni bir güncellemedir URLSearchParams özellikleri Aynı sonucu daha kısa sürede elde etmek için. Başlıklı cevaba bakınız "URLSearchParams" altında.


7025



Kimse saf Javascript ile yapılamayacağını söylüyor. JQuery'yi kullanıyorsanız ve jQuery'nin bunu yapması için bir işlevi varsa, jQuery'yi yeni bir işlevle yeniden icat etmek yerine kullanmak mantıklı olacaktır. - Cerin
Bu işlev nasıl çalışır http://www.mysite.com/index.php?x=x1&x=x2&x=x3 Alanın değeri x Belirsiz. - dpp
bu da işlemez çok değerli tuşlar, aynı zamanda mükemmel yasal. - hurrymaplelad
Bunun için neden düzenli bir ifade kullanıyorsunuz? - Ry-♦
Bir sorgulama için ?mykey=0&m.+key=1, arayarak getParameterByName("m.+key") dönecekti 0 yerine 1. Normal ifadedeki meta karakterlerden kaçmanız gerekiyor name düzenli ifadenizi oluşturmadan önce. Ve sadece araman gerek .replace() bir kez küresel bayrağı kullanarak ve kullanarak "\\$&" yedek ifade olarak. Araştırmalısın location.search yerine location.href. Bu ayrıntılar için 400'den fazla verinin bir cevabı dikkate alınmalıdır. - gilly3


Burada yayınlanan çözümlerin bazıları verimsizdir. Komut dosyasının bir parametreye erişmesi gerektiğinde, düzenli ifade aramasının tekrarlanması tamamen gereksizdir, parametreleri bir ilişkilendirici dizi stili nesnesine bölmek için tek bir işlev yeterlidir. HTML 5 Geçmiş API'sı ile çalışmıyorsanız, bu yalnızca sayfa yükleme başına bir kez gereklidir. Buradaki diğer öneriler de URL’yi doğru bir şekilde çözemez.

var urlParams;
(window.onpopstate = function () {
    var match,
        pl     = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
        query  = window.yer.search.alt dize(1);

    urlParams = {};
    while (match = search.exec(query))
       urlParams[decode(match[1])] = decode(match[2]);
})();

Örnek sorgulama:

?i=main&mode=front&sid=de8d49b78a85a322c4155015fdce22c4&enc=+Hello%20&empty

Sonuç:

 urlParams = {
    enc: " Hello ",
    i: "main",
    mode: "front",
    sid: "de8d49b78a85a322c4155015fdce22c4",
    empty: ""
}

alert(urlParams["mode"]);
// -> "front"

alert("empty" in urlParams);
// -> true

Bu da dizi tarzı sorgu dizeleri işlemek için kolayca geliştirilebilir. Bunun bir örneği İşteancak dizi tarzı parametreler tanımlanmadığı için RFC 3986 Bu cevabı kaynak kodla kirletmeyeceğim. "Kirlenmiş" bir versiyonla ilgilenenler için aşağıdaki kamp belgesinin cevabına bakın.

Ayrıca, yorumlarda belirtildiği gibi, ; için yasal bir sınırlayıcıdır key=value çiftleri. İşlenecek daha karmaşık bir regex gerektirir ; veya &Bence gereksiz olduğunu düşünüyorum çünkü ; kullanılır ve her ikisinin de kullanılması daha olası değildir. Desteğe ihtiyacınız varsa ; yerine &Sadece onları normal ifadeyle değiştirin.


  Bir sunucu tarafı önişleme dili kullanıyorsanız, sizin için ağır kaldırma işlemini yapmak üzere yerel JSON işlevlerini kullanmak isteyebilirsiniz. Örneğin, PHP'de yazabilirsiniz:

<script>var urlParams = <?php echo json_encode($_GET, JSON_HEX_TAG);?>;</script>

Çok daha basit!


1627



Eğer ağır bir ajax'd uygulaması yapıyorsanız, o zaman "geri düğmesini etkinleştirmek için" hash (#) kullanıyor olabilirsiniz ... bu durumda querystring her zaman değişecektir (facebook nasıl yapar). .. Ancak bu çözümler # anways'den sonra gelen şeyleri görmezden geliyor ... - Nick Franceschina
@Nick: hash içinde bulunan herhangi bir şey window.location.hash özellik, ayrı window.location.search özelliği. Eğer karma değişiyorsa, o da sorgucılığı etkilemez. - Andy E
Unutma ; bir yasal sınırlayıcı unutmak key=value çiftleri. Nadirdir, ancak uygulanması 5 saniye sürer. - alex
Adil olmak gerekirse, sorgu dizesi için belirli bir format RFC3986 tarafından tanımlanmamıştır. ?a=b&c=d gelenekseldir ve web formları için bir W3C tavsiyesidir, ancak URI özellikleri sadece tanımlar query = *( pchar / "/" / "?" ). - Matthew Gilliard
Oldukça sıkı bir JSHint kurulumu kullananlarımız için while(match = search.exec(query)) ile while((match = search.exec(query)) !== null) - craigts


ES2015 (ES6)

getQueryStringParams = query => {
    return query
        ? (/^[?#]/.test(query) ? query.slice(1) : query)
            .split('&')
            .reduce((params, param) => {
                    let [key, value] = param.split('=');
                    params[key] = value ? decodeURIComponent(value.replace(/\+/g, ' ')) : '';
                    return params;
                }, {}
            )
        : {}
};

JQuery olmadan

var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i)
    {
        var p=a[i].split('=', 2);
        if (p.length == 1)
            b[p[0]] = "";
        else
            b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return b;
})(window.location.search.substr(1).split('&'));

Gibi bir URL ile ?topic=123&name=query+string, aşağıdaki geri dönecektir:

qs["topic"];    // 123
qs["name"];     // query string
qs["nothere"];  // undefined (object)

Google yöntemi

Google'ın kodunu yırtmak, kullandıkları yöntemi buldum: getUrlParameters

function (b) {
    var c = typeof b === "undefined";
    if (a !== h && c) return a;
    for (var d = {}, b = b || k[B][vb], e = b[p]("?"), f = b[p]("#"), b = (f === -1 ? b[Ya](e + 1) : [b[Ya](e + 1, f - e - 1), "&", b[Ya](f + 1)][K](""))[z]("&"), e = i.dd ? ia : unescape, f = 0, g = b[w]; f < g; ++f) {
        var l = b[f][p]("=");
        if (l !== -1) {
            var q = b[f][I](0, l),
                l = b[f][I](l + 1),
                l = l[Ca](/\+/g, " ");
            try {
                d[q] = e(l)
            } catch (A) {}
        }
    }
    c && (a = d);
    return d
}

Bu gizlenmiş, ama anlaşılabilir.

URL'deki parametreleri aramaya başlarlar. ? ve aynı zamanda karma #. Sonra her bir parametre için eşit işarete bölünürler. b[f][p]("=") (gibi görünüyor indexOfanahtar / değer almak için char konumunu kullanırlar). Bölünmüş olması, parametrenin bir değeri olup olmadığını kontrol eder, eğer varsa, daksi halde devam ederler.

Sonunda nesne d kaçıyor, kaçıyor ve + işaret. Bu nesne benimki gibi, aynı davranışa sahip.


Benim yöntemim olarak jQuery eklentisi

(function($) {
    $.QueryString = (function(paramsArray) {
        let params = {};

        for (let i = 0; i < paramsArray.length; ++i)
        {
            let param = paramsArray[i]
                .split('=', 2);

            if (param.length !== 2)
                continue;

            params[param[0]] = decodeURIComponent(param[1].replace(/\+/g, " "));
        }

        return params;
    })(window.location.search.substr(1).split('&'))
})(jQuery);

kullanım

//Get a param
$.QueryString.param
//-or-
$.QueryString["param"]
//This outputs something like...
//"val"

//Get all params as object
$.QueryString
//This outputs something like...
//Object { param: "val", param2: "val" }

//Set a param (only in the $.QueryString object, doesn't affect the browser's querystring)
$.QueryString.param = "newvalue"
//This doesn't output anything, it just updates the $.QueryString object

//Convert object into string suitable for url a querystring (Requires jQuery)
$.param($.QueryString)
//This outputs something like...
//"param=newvalue&param2=val"

//Update the url/querystring in the browser's location bar with the $.QueryString object
history.replaceState({}, '', "?" + $.param($.QueryString));
//-or-
history.pushState({}, '', "?" + $.param($.QueryString));

Performans testi (regex yöntemine karşı bölünmüş yöntem) (jsPerf)

Hazırlama kodu: yöntem beyanı

Bölünmüş test kodu

var qs = window.GetQueryString(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];

Regex test kodu

var search = window.getParameterByName("q");
var value = window.getParameterByName("value");
var undef = window.getParameterByName("undefinedstring");

Windows Server 2008 R2 / 7 x64 üzerinde Firefox 4.0 x86'da test etme

  • Bölünmüş yöntemi: 144.780 ±% 2.17 daha hızlı
  • Regex yöntemi: 13,891 ±% 0,85 | % 90 daha yavaş

1193



Bu aynı zamanda düzenli ifadeler kullanmak yerine güzel bir yaklaşım, dize bölme. Söylemeye değer birkaç şey var, ama :-) 1. unescape kullanımdan kaldırılmış bir işlevdir ve decodeURIComponent(), bu işlevlerden hiçbirinin doğru bir şekilde kod çözmeyeceğini unutmayın. + boşluk karakterine. 2. Bir diziden ziyade sonucu bir nesne olarak bildirmelisiniz, çünkü JavaScript'in ilişkilendirilebilen dizileri yoktur ve bildirdiğiniz dizi bir nesne olarak ele alınır. - Andy E
Herhangi bir jQuery özel kod bulunmadığında bunu neden jQuery eklentisi yapacağınızı merak ediyorsunuz? - zachleat
Eğer bir çerçeveniz yoksa @zachleat fonksiyonlarınız sadece kodunuza yayılacaktır. JQuery'yi genişletirseniz, işlevleriniz için bir kapsamınız olacak, kodunuzda bir yerlerde dolaşmayacaksınız. Bunun tek sebebi olduğunu düşünüyorum. - BrunoLM
İşte jQuery sürümü geçmek için tweaked JSLint (en azından 2011-06-15 tarihinde JSLint.com'un yarı hareketli hedefi). Çoğunlukla sadece Crockford'u rahatlatmak için etrafta dolaşıyor. - patridge
@BenjaminGruenbaum şaka gibi, ben de URL ayrıştırma performansını kıyaslama noktasında oldukça görmüyorum. Bu, Düğümden, günlükleri ayrıştırmak için bir izomorfik JavaScript modülüne dönüştürülmüşse, o zaman evet. Ancak, URL parametrelerini window.location URL'ye giden müşterinin uzak, çok daha pahalı olduğu göz önüne alındığında, herhangi bir performans kaygısını tartışır. - Dan Dascalescu


Geliştirilmiş sürümü Artem Barger'ın cevabı:

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

İyileştirme hakkında daha fazla bilgi için: http://james.padolsey.com/javascript/bujs-1-getparameterbyname/


636



Eğer biraz daha kısaltmak istiyorsanız, üçlü koşulu ortadan kaldırabilir ve bu son satırda bir miktar kısa devre ile değiştirebilirsiniz. return match && decodeURIComponent(match[1].replace(/\+/g, ' '));. - Andy E
Döner null Eğer parametre takip etmez ise '='. Hazırlanabilirsin if (!RegExp('[?&]'+name+'(&.*)?$').exec(window.location.search)) return false; geri dönmek boolean false Parametre hiç değilse. - commonpike
Kullanırdım new regex oluştururken önek: var match = new RegExp('... - Patrick Berkeley
IE11 hatası: IE, ascii karakteri 8206 (hex: 200E - "soldan sağa karakter") ile döndürülen değeri başlatamaya karar verir. Bunu bulmak için 6 saatten fazla zaman harcadım! terapötik havalandırma .... düzeltmek için son satırın sonuna yapıştırın: .replace('\u200E', '') - JayRO-GreyBeard
En azından bir macun üzerindeki kromda (belki diğer tarayıcılarda da) son değer bir '/' ekleniyordu. Bu yüzden onu görmezden gelmek için düzenli ifadeyi değiştirdim. var results = new RegExp('[\\?&]' + name + '=([^&#/]*)').exec(url); - CaseyB


URLSearchParams

Firefox 44+, Opera 36+, Edge 17+, Safari 10.3+ ve Chrome 49+ desteği URLSearchParams API:

Google önerisi var URLSearchParams polyfill IE'nin kararlı sürümleri için.

Tarafından standartlaştırılmadı W3Cama bu canlı bir standarttır WHATWG.

Bunu yerde kullanabilirsiniz, ancak ? soru işareti (örneğin, .slice(1)):

let params = new URLSearchParams(location.search.slice(1));

veya

let params = (new URL(location)).searchParams;

Veya elbette herhangi bir URL’de:

let url = new URL('https://example.com?foo=1&bar=2');
let params = new URLSearchParams(url.search.slice(1));

Paramları kısa yoldan da kullanabilirsin .searchParams URL nesnesindeki özellik şöyle:

let params = new URL('https://example.com?foo=1&bar=2').searchParams;
params.get('foo'); // "1"
params.get('bar'); // "2" 

Parametreleri okur / ayarlarsınız get(KEY), set(KEY, VALUE), append(KEY, VALUE) API. Ayrıca tüm değerler üzerinde yineleyebilirsiniz for (let p of params) {}.

bir referans uygulaması ve bir Örnek Sayfa Denetim ve test için kullanılabilir.


482



IE hala eksik ... kullanıyorum değil :( - mlt
Bu iki downvoter muhtemelen (sadece benim yaptığım gibi) kaçırmamalısın. .get sadece yerine . - Nakilon
Aslında ihtiyacın yok slice(1) üzerinde .searchdoğrudan kullanabilirsiniz. URLSearchParams lider işleyebilir ?. - Jason C
Lütfen oy bunun için böcek düzeltmek için. Bu Edge ekibinin ilgi olduğunu bilmesini sağlayacak! - styfle
En iyi cevap. Sonunda birisi yerli yaklaşım sağladı. Teşekkürler - Green


Başka bir öneri. Eklenti Ters örgü çapa, ana makine vb. dahil olmak üzere URL'nin tüm bölümlerini almayı sağlar.

JQuery ile veya jQuery olmadan kullanılabilir.

Kullanımı çok basit ve havalı:

var url = $.url('http://allmarkedup.com/folder/dir/index.html?item=value'); // jQuery version
var url = purl('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.attr('protocol'); // returns 'http'
url.attr('path'); // returns '/folder/dir/index.html'

Ancak, 11 Kasım 2014 itibariyle, Purl artık korunmuyor ve yazarın kullanılmasını önerir URI.js yerine. JQuery eklentisi, elemanlara odaklandığı için farklıdır - dizelerle kullanım için, sadece URI jQuery ile veya olmadan doğrudan. Benzer kod, daha dolgun dokümanlar gibi görünürdü İşte:

var url = new URI('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.protocol(); // returns 'http'
url.path(); // returns '/folder/dir/index.html'

394



Yazılı olarak purl artık sürdürülmez ve önceki bakıcı önerdi uri.js - Dan Pantry


tl; Dr.

Hızlı, tam çözümhangi kolları çok değerli tuşlar ve kodlanmış karakterler.

var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {var s = item.split("="), k = s[0], v = s[1] && decodeURIComponent(s[1]); (qd[k] = qd[k] || []).push(v)})

//using ES6   (23 characters cooler)
var qd = {};
if (location.search) location.search.substr(1).split`&`.forEach(item => {let [k,v] = item.split`=`; v = v && decodeURIComponent(v); (qd[k] = qd[k] || []).push(v)})
Çok çizgili:
var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {
    var s = item.split("="),
        k = s[0],
        v = s[1] && decodeURIComponent(s[1]); //  null-coalescing / short-circuit
    //(k in qd) ? qd[k].push(v) : qd[k] = [v]
    (qd[k] = qd[k] || []).push(v) // null-coalescing / short-circuit
})

Bütün bu kod nedir?
"Null coalescing", kısa devre değerlendirmesi
ES6 Yıkıcı ödevler, Ok fonksiyonları, Şablon dizgileri

Örnek:
"?a=1&b=0&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

> qd.a[1]    // "5"
> qd["a"][1] // "5"



Daha fazla bilgi için ... Vanilla JavaScript çözümü hakkında.

URL kullanımının farklı bölümlerine erişmek için location.(search|hash)

En kolay (kukla) çözüm

var queryDict = {};
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})
  • Kolları boş tuşlar doğru şekilde.
  • geçersiz kılar Çoklu tuşlar ile son değer bulundu.
"?a=1&b=0&c=3&d&e&a=5"
> queryDict
a: "5"
b: "0"
c: "3"
d: undefined
e: undefined

Çok değerli tuşlar

Basit anahtar kontrolü (item in dict) ? dict.item.push(val) : dict.item = [val]

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {(item.split("=")[0] in qd) ? qd[item.split("=")[0]].push(item.split("=")[1]) : qd[item.split("=")[0]] = [item.split("=")[1]]})
  • Şimdi döndürür diziler yerine.
  • Erişim değerleri qd.key[index] veya qd[key][index]
> qd
a: ["1", "5"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined]

Kodlanmış karakterler?

kullanım decodeURIComponent() Ikinci için ya da her ikisi de böler.

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {var k = item.split("=")[0], v = decodeURIComponent(item.split("=")[1]); (k in qd) ? qd[k].push(v) : qd[k] = [v]})
Örnek:
"?a=1&b=0&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: ["undefined"]  // decodeURIComponent(undefined) returns "undefined" !!!*
e: ["undefined", "http://w3schools.com/my test.asp?name=ståle&car=saab"]



Yorumlardan

* !!! Lütfen bunu not al decodeURIComponent(undefined) dize döndürür "undefined". Çözüm basit bir kullanımda yatar. &&bunu sağlayan decodeURIComponent() tanımsız değerlerde çağrılmaz. (Üstte "tam çözüm" bölümüne bakın.)

v = v && decodeURIComponent(v);


Eğer querystring boşsa (location.search == ""), sonuç biraz yanıltıcıdır qd == {"": undefined}. Ayrıştırma işlevi likeso başlatılmadan önce querystring kontrol etmek için önerilmektedir:

if (location.search) location.search.substr(1).split("&").forEach(...)

217



Güzel. Değiştireceğim tek şey - bir anahtar için birden fazla değer yoksa, bir dizi olması gerekmiyor. Sadece anahtar başına birden fazla değer varsa diziyi kullanın. - Pavel Nikolov
@PavelNikolov Bazen bir dizi ve bazen bir değer elde etmekte zorluklar getireceğini düşünüyorum. İlk önce kontrol etmelisiniz, şimdi sadece uzunluğu kontrol edersiniz, çünkü bu değerleri geri almak için döngüleri kullanacaksınız. Ayrıca bu, en kolay, ancak işlevsel, çözüm olması anlamına geliyordu. - Qwerty
@twig IE8'de çalışmayacak - sqram
Okunabilirlik için bir bit düzleştirildi, bir işlev haline getirildi ve bölünmüş çağrı yeniden kullanıldı: function parseQueryString () {var qd = {}; location.search.substr (1) .split ("&"). forEach (işlev (öğe) {var parçalar = item.split ("="); var k = parçalar [0]; var v = kod çözme öğesi (parçalar [ 1]); (kd qd) ö qd [k] .push (v): qd [k] = [v,]}); qd dönüşü; } - Casey
decodeDocumentURI (undefined), undefined yerine "undefined" değerini döndürür. Fonksiyonel ama çok zarif olmayan bir yama: var qd = {}; location.search.substr(1).split("&").forEach( function(item) { var s = item.split("="), k = s[0], v; if(s.length>1) v = decodeURIComponent(s[1]); (k in qd) ? qd[k].push(v) : qd[k] = [v] }) - loop


Snipplr.com'daki Roshambo'nun, bu makalede açıklanan şekilde gerçekleştirilebilmesi için basit bir betiği vardır. JQuery ile URL Parametreleri Alın | Gelişmiş. Komut dosyasıyla, sadece istediğiniz parametreleri kolayca çekebilirsiniz.

İşte burası:

$.urlParam = function(name, url) {
    if (!url) {
     url = window.location.href;
    }
    var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(url);
    if (!results) { 
        return undefined;
    }
    return results[1] || undefined;
}

Ardından, parametrelerinizi sorgu dizesinden alın.

Yani, URL / sorgu dizesi xyz.com/index.html?lang=de.

Sadece ara var langval = $.urlParam('lang');ve sende var.

UZBEKJON bunun üzerinde harika bir blog yazısı var, JQuery ile URL parametrelerini ve değerlerini alın.


215



jQuery ile işlevi jQuery nesnesine adlandırmak anlamına gelir. Ayrıca, geçersiz değer neden 0? Tabii, sıkı eşitlik kontrolünü kullanabilirim, ama olmamalı null ? - alex
Kabul. Bu, normal bir javascript değişken referansı gibi çalışır (belki de tanımlanmamış geri dönüşler daha doğru olur). - Isochronous
'name' doğru şekilde kaçmadı, sadece doğrudan RegExp'e enjekte edildi. Bu başarısız olur. Diğerleri de söylediğim gibi, bu cevaplar, test edilmiş bir kütüphanede uygulanması gerektiğinde, bu cevaplar tekerleği yeniden icat etmek ve çok oy almaktır. - Triynko


JQuery kullanıyorsanız, kitaplık gibi jQuery Barbekü: Geri Düğme ve Sorgu Kütüphanesi.

... jQuery Barbekü bir tam sağlar .deparam() yöntem, hem karma durum yönetimi hem de parça / sorgu dizgesi ayrıştırması ve birleştirme yardımcı yöntemleri ile birlikte.

Düzenleme: Deparam Ekleme Örneği:

 var DeparamExample = function() {
            var params = $.deparam.querystring();

            //nameofparam is the name of a param from url
            //code below will get param if ajax refresh with hash
            if (typeof params.nameofparam == 'undefined') {
                params = jQuery.deparam.fragment(window.location.href);
            }
            
            if (typeof params.nameofparam != 'undefined') {
                var paramValue = params.nameofparam.toString();
                  
            }
        };

Sadece düz JavaScript kullanmak istiyorsanız, kullanabilirsiniz ...

var getParamValue = (function() {
    var params;
    var resetParams = function() {
            var query = window.location.search;
            var regex = /[?&;](.+?)=([^&;]+)/g;
            var match;

            params = {};

            if (query) {
                while (match = regex.exec(query)) {
                    params[match[1]] = decodeURIComponent(match[2]);
                }
            }    
        };

    window.addEventListener
    && window.addEventListener('popstate', resetParams);

    resetParams();

    return function(param) {
        return params.hasOwnProperty(param) ? params[param] : null;
    }

})();​

Yeni HTML Geçmişi API'sı ve özellikle history.pushState() ve history.replaceState()URL, parametrelerin önbelleğini geçersiz kılacak ve değerleri değiştirebilir.

Bu sürüm, geçmiş her değiştiğinde dahili önbellek parametrelerini günceller.


164