Câu hỏi Làm thế nào tôi có thể nhận được các giá trị chuỗi truy vấn trong JavaScript?


Có cách nào ít tốn kém hơn để truy xuất chuỗi truy vấn giá trị thông qua jQuery (hoặc không có)?

Nếu vậy, làm thế nào? Nếu không, có plugin nào có thể làm như vậy không?


2703


gốc


Tôi sử dụng plugin getUrlParam diễn tả cái jQuery-Plugin - getUrlParam (phiên bản 2). - coma
A javascript đơn giản giải pháp không có RegEx: css-tricks.com/snippets/javascript/get-url-variables - Lorenzo Polidori
Mặc dù giải pháp hàng đầu cho câu hỏi xứng đáng phổ biến vì quan sát tuyệt vời của nó là jQuery không cần thiết, phương pháp tạo các biểu thức chính quy mới và phân tích lại chuỗi truy vấn cho mọi tham số mong muốn là cực kỳ kém hiệu quả. Các giải pháp hiệu quả hơn (và linh hoạt) đã tồn tại trong một thời gian dài, ví dụ trong bài viết này được in lại ở đây: htmlgoodies.com/beyond/javascript/article.php/11877_3755006_3/… - Joseph Myers
có thể trùng lặp Chuỗi truy vấn JavaScript
Joseph, "quan sát tuyệt vời mà jQuery là không cần thiết"? Tất nhiên là không cần thiết. Mọi thứ jQuery làm, nó sử dụng JavaScript. Mọi người không sử dụng jQuery vì nó làm những thứ mà JavaScript không thể làm được. Điểm của jQuery là tiện lợi. - Vladimir Kornea


Các câu trả lời:


Bạn không cần jQuery cho mục đích đó. Bạn chỉ có thể sử dụng một số JavaScript thuần túy:

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, ' '));
}

Sử dụng:

// 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)


Lưu ý: Nếu một tham số xuất hiện nhiều lần (?foo=lorem&foo=ipsum), bạn sẽ nhận được giá trị đầu tiên (lorem). Không có tiêu chuẩn về điều này và tập quán khác nhau, xem ví dụ câu hỏi này: Vị trí ủy quyền của các khóa truy vấn HTTP GET trùng lặp.
LƯU Ý: Hàm này phân biệt chữ hoa chữ thường. Nếu bạn thích tên thông số không phân biệt dạng chữ, thêm công cụ sửa đổi 'i' vào RegExp


Đây là bản cập nhật dựa trên mới Thông số URLSearchParams để đạt được kết quả tương tự ngắn gọn hơn. Xem câu trả lời có tiêu đề "URLSearchParams" phía dưới.


7025



Không ai nói rằng nó không thể được thực hiện với Javascript thuần túy. Nếu bạn đã sử dụng jQuery, và jQuery có một chức năng để làm điều này, thì sẽ có ý nghĩa khi sử dụng jQuery thay vì phát minh lại bánh xe bằng một hàm mới. - Cerin
Chức năng này xử lý như thế nào http://www.mysite.com/index.php?x=x1&x=x2&x=x3 Giá trị của trường x là mơ hồ. - dpp
điều này cũng không xử lý khóa đa giá trị, cũng hoàn toàn hợp pháp. - hurrymaplelad
Tại sao bạn sử dụng cụm từ thông dụng cho điều này? - Ry-♦
Đối với chuỗi truy vấn của ?mykey=0&m.+key=1, gọi điện getParameterByName("m.+key") sẽ trở lại 0 thay vì 1. Bạn cần phải thoát khỏi metacharacters biểu thức chính quy trong name trước khi xây dựng cụm từ thông dụng của bạn. Và bạn chỉ cần gọi .replace() một lần bằng cách sử dụng cờ toàn cầu và sử dụng "\\$&" như là biểu thức thay thế. Bạn nên tìm kiếm location.search thay vì location.href. Một câu trả lời với hơn 400 upvotes nên tài khoản cho các chi tiết này. - gilly3


Một số giải pháp được đăng ở đây không hiệu quả. Lặp lại việc tìm kiếm biểu thức chính quy mỗi khi kịch bản cần truy cập một tham số là hoàn toàn không cần thiết, một hàm duy nhất để phân chia các tham số thành một đối tượng kiểu mảng kết hợp là đủ. Nếu bạn không làm việc với API lịch sử HTML 5, điều này chỉ cần thiết một lần cho mỗi lần tải trang. Các đề xuất khác ở đây cũng không giải mã được chính xác URL.

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.vị trí.search.chuỗi con(1);

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

Chuỗi truy vấn mẫu:

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

Kết quả:

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

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

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

Điều này có thể dễ dàng được cải thiện khi xử lý các chuỗi truy vấn kiểu mảng. Một ví dụ về điều này là đây, nhưng vì các tham số kiểu mảng không được xác định trong RFC 3986 Tôi sẽ không gây ô nhiễm câu trả lời này với mã nguồn. Đối với những người quan tâm đến phiên bản "bị ô nhiễm", hãy xem câu trả lời của campbeln bên dưới.

Ngoài ra, như đã chỉ ra trong các bình luận, ; là một dấu phân cách hợp pháp cho key=value cặp. Nó sẽ đòi hỏi một regex phức tạp hơn để xử lý ; hoặc là &, điều tôi nghĩ là không cần thiết vì hiếm khi ; được sử dụng và tôi sẽ nói thậm chí không chắc rằng cả hai sẽ được sử dụng. Nếu bạn cần hỗ trợ ; thay vì &, chỉ cần hoán đổi chúng trong regex.


  Nếu bạn đang sử dụng ngôn ngữ tiền xử lý phía máy chủ, bạn có thể muốn sử dụng các hàm JSON gốc của nó để thực hiện việc nâng cấp nặng nề cho bạn. Ví dụ, trong PHP bạn có thể viết:

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

Đơn giản hơn nhiều!


1627



nếu bạn đang làm một ứng dụng ajax'd nặng, thì bạn có thể đang sử dụng hàm băm (#) để "kích hoạt nút quay lại" ... trong trường hợp đó chuỗi truy vấn sẽ thay đổi mọi lúc (xem cách facebook thực hiện). .. mặc dù các giải pháp này bỏ qua những thứ đến sau # anways ... - Nick Franceschina
@Nick: Bất cứ điều gì sau khi băm nằm trong window.location.hash tài sản riêng biệt với window.location.search bất động sản. Nếu băm thay đổi, nó không ảnh hưởng đến chuỗi truy vấn chút nào. - Andy E
Đừng quên ; là một pháp lý delimiter quên key=value cặp. Nó là hiếm, nhưng phải mất 5 giây để thực hiện. - alex
Để công bằng, không có định dạng cụ thể cho chuỗi truy vấn được xác định bởi RFC3986. ?a=b&c=d là thông thường và đề xuất W3C cho biểu mẫu web, nhưng thông số URI chỉ xác định query = *( pchar / "/" / "?" ). - Matthew Gilliard
Đối với những người trong chúng ta sử dụng một thiết lập khá chặt chẽ của JSHint, hãy trao đổi while(match = search.exec(query)) với 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;
                }, {}
            )
        : {}
};

Không có jQuery

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('&'));

Với một URL như ?topic=123&name=query+string, sau đây sẽ trả về:

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

Phương thức của Google

Xé mã của Google Tôi đã tìm thấy phương thức mà họ sử dụng: 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
}

Nó là obfuscated, nhưng nó là dễ hiểu.

Họ bắt đầu tìm kiếm các thông số trên url từ ? và cũng từ băm #. Sau đó, đối với mỗi tham số, chúng phân tách bằng dấu bằng b[f][p]("=") (trông giống như indexOf, họ sử dụng vị trí của char để lấy khóa / giá trị). Sau khi chia nhỏ, họ kiểm tra xem thông số có giá trị hay không, nếu có thì chúng sẽ lưu giá trị của d, nếu không họ chỉ tiếp tục.

Cuối cùng đối tượng d được trả về, xử lý thoát và + ký tên. Đối tượng này cũng giống như của tôi, nó có hành vi tương tự.


Phương pháp của tôi như là một Plugin jQuery

(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);

Sử dụng

//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));

Kiểm tra hiệu suất (phương pháp tách phương pháp regex) (jsPerf)

Mã chuẩn bị: khai báo phương thức

Mã thử nghiệm tách

var qs = window.GetQueryString(query);

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

Mã kiểm tra Regex

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

Thử nghiệm trong Firefox 4.0 x86 trên Windows Server 2008 R2 / 7 x64

  • Phương thức tách: 144,780 ± 2,17% nhanh nhất
  • Phương thức Regex: 13,891 ± 0,85% | 90% chậm hơn

1193



Đây cũng là một cách tiếp cận tốt đẹp, tách chuỗi thay vì sử dụng cụm từ thông dụng. Có một vài điều đáng chú ý, mặc dù :-) 1. unescape là một hàm không được chấp nhận và được thay thế bằng decodeURIComponent(), lưu ý rằng cả hai chức năng này sẽ không giải mã chính xác + đến một ký tự không gian. 2. Bạn nên khai báo kết quả dưới dạng một đối tượng, chứ không phải là một mảng vì JavaScript không có mảng kết hợp, mỗi phần tử và mảng mà bạn khai báo được coi là một đối tượng bằng cách gán các thuộc tính được đặt tên cho nó. - Andy E
Tò mò tại sao bạn muốn làm cho một plugin jQuery này khi nó không có bất kỳ mã cụ thể jQuery nào? - zachleat
@zachleat nếu bạn không có một khuôn khổ, các chức năng của bạn sẽ chỉ có được trải rộng trên mã của bạn. Nếu bạn mở rộng jQuery, bạn sẽ có một phạm vi cho các chức năng của bạn, nó sẽ không được thả nổi xung quanh một nơi nào đó trong mã của bạn. Tôi nghĩ đó là lý do duy nhất. - BrunoLM
Đây là phiên bản jQuery tinh chỉnh để vượt qua JSLint (ít nhất là mục tiêu bán động của JSLint.com vào 2011-06-15). Chủ yếu là di chuyển mọi thứ xung quanh để xoa dịu Crockford. - patridge
Như @BenjaminGruenbaum nói đùa, tôi cũng không hoàn toàn thấy điểm trong đo điểm chuẩn hiệu suất của phân tích cú pháp URL. Nếu điều này được tạo thành một mô-đun JavaScript đẳng cấu có thể được gọi từ Node đến, ví dụ, phân tích các bản ghi, sau đó có. Nhưng sử dụng nó để trích xuất các tham số URL từ window.location thực hiện bất kỳ mối quan tâm hiệu suất nào, do khách hàng điều hướng đến URL là xa, đắt hơn nhiều. - Dan Dascalescu


Phiên bản cải tiến của Câu trả lời của Artem Barger:

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

Để biết thêm thông tin về cải tiến, hãy xem: http://james.padolsey.com/javascript/bujs-1-getparameterbyname/


636



Nếu bạn muốn rút ngắn nó nhiều hơn một chút, bạn có thể loại bỏ điều kiện bậc ba và thay thế nó bằng một chút mạch ngắn trên dòng cuối cùng đó - return match && decodeURIComponent(match[1].replace(/\+/g, ' '));. - Andy E
Nó trở lại null nếu tham số không được theo sau bởi '='. Bạn có thể thêm vào if (!RegExp('[?&]'+name+'(&.*)?$').exec(window.location.search)) return false; để làm cho nó trở lại boolean false nếu tham số không có ở tất cả. - commonpike
Tôi sẽ sử dụng new tiền tố khi tạo regex: var match = new RegExp('... - Patrick Berkeley
Lỗi IE11: IE quyết định thêm giá trị trả về với ký tự ascii 8206 (hex: 200E - ký tự "từ trái sang phải"). Tôi lãng phí hơn 6 giờ tìm kiếm điều này! điều trị thông gió .... để sửa chữa, tack vào cuối dòng cuối cùng: .replace('\u200E', '') - JayRO-GreyBeard
Trong chrome trên một mac ít nhất (có thể các trình duyệt khác quá) giá trị cuối cùng đã nhận được một '/' nối thêm. Vì vậy, tôi đã sửa đổi regex để bỏ qua nó. var results = new RegExp('[\\?&]' + name + '=([^&#/]*)').exec(url); - CaseyB


URLSearchParams

Firefox 44+, Opera 36+, Edge 17+, Safari 10.3+ và Chrome 49+ hỗ trợ URLSearchParams API:

Có một đề xuất google URLSearchParams polyfill cho các phiên bản IE ổn định.

Nó không được chuẩn hóa bởi W3C, nhưng đó là mức sống của WhatWG.

Bạn có thể sử dụng nó trên vị trí, nhưng bạn cần phải loại bỏ ? dấu chấm hỏi (ví dụ, với .slice(1)):

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

hoặc là

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

Hoặc tất nhiên trên bất kỳ URL nào:

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

Bạn cũng có thể lấy thông số bằng cách viết tắt .searchParams thuộc tính trên đối tượng URL, như sau:

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

Bạn đọc / đặt thông số thông qua get(KEY), set(KEY, VALUE), append(KEY, VALUE) API. Bạn cũng có thể lặp qua tất cả các giá trị for (let p of params) {}.

A Thực hiện tham khảo và một trang mẫu có sẵn để kiểm tra và thử nghiệm.


482



IE vẫn còn bỏ lỡ ... không phải là tôi đang sử dụng nó: ( - mlt
Hai kẻ phá hủy đó có lẽ đã bỏ lỡ (như tôi vừa làm) thực tế là bạn phải sử dụng .get Thay vì chỉ . - Nakilon
Bạn không thực sự cần slice(1) trên .search, bạn có thể sử dụng nó trực tiếp. URLSearchParams có thể xử lý hàng đầu ?. - Jason C
Xin vui lòng bỏ phiếu cho cái này lỗi để cố định. Điều này sẽ cho phép đội Edge biết có sự quan tâm! - styfle
Câu trả lời hay nhất. Cuối cùng, ai đó đã cung cấp phương pháp tiếp cận gốc. Cảm ơn - Green


Chỉ là một đề xuất khác. Các plugin Purl cho phép truy xuất tất cả các phần của URL, bao gồm cả neo, máy chủ, v.v.

Nó có thể được sử dụng có hoặc không có jQuery.

Cách sử dụng rất đơn giản và thú vị:

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'

Tuy nhiên, kể từ ngày 11 tháng 11 năm 2014, Purl không còn được duy trì và tác giả đề xuất sử dụng URI.js thay thế. Các plugin jQuery là khác nhau ở chỗ nó tập trung vào các yếu tố - để sử dụng với các chuỗi, chỉ cần sử dụng URI trực tiếp, có hoặc không có jQuery. Mã tương tự sẽ trông như vậy, tài liệu đầy đủ hơn đây:

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



Kể từ khi viết purl không còn được duy trì và người bảo trì trước đó gợi ý uri.js - Dan Pantry


tl; dr

Một cách nhanh chóng, Giải pháp hoàn chỉnh, xử lý khóa đa giá trị và ký tự được mã hóa.

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)})
Đa lót:
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
})

Tất cả mã này là gì ...
"null-coalescing", đánh giá ngắn mạch
ES6 Nhiệm vụ hủy cấu trúc, Chức năng mũi tên, Chuỗi mẫu

Thí dụ:
"?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"



Đọc thêm ... về giải pháp Vanilla JavaScript.

Để truy cập các phần khác nhau của việc sử dụng URL location.(search|hash)

Giải pháp dễ nhất (giả)

var queryDict = {};
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})
  • Xử lý khóa trống đúng.
  • Ghi đè nhiều phím với Cuối cùng tìm thấy giá trị.
"?a=1&b=0&c=3&d&e&a=5"
> queryDict
a: "5"
b: "0"
c: "3"
d: undefined
e: undefined

Khóa đa giá trị

Kiểm tra khóa đơn giản (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]]})
  • Trả lại mảng thay thế.
  • Truy cập các giá trị theo qd.key[index] hoặc là qd[key][index]
> qd
a: ["1", "5"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined]

Các ký tự được mã hóa?

Sử dụng decodeURIComponent() Cho lần thứ hai hoặc cả hai chia tách.

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]})
Thí dụ:
"?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"]



Từ nhận xét

* !!! Xin lưu ý rằng decodeURIComponent(undefined) trả về chuỗi "undefined". Giải pháp nằm trong cách sử dụng đơn giản &&, đảm bảo rằng decodeURIComponent() không được gọi trên các giá trị không xác định. (Xem "giải pháp hoàn chỉnh" ở trên cùng.)

v = v && decodeURIComponent(v);


Nếu chuỗi truy vấn trống (location.search == ""), kết quả có phần gây hiểu nhầm qd == {"": undefined}. Bạn nên kiểm tra chuỗi truy vấn trước khi khởi chạy hàm phân tích likeso:

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

217



Tốt đẹp. Điều duy nhất tôi sẽ thay đổi - là nếu không có nhiều hơn một giá trị cho một khóa thì không cần thiết phải là một mảng. Chỉ sử dụng mảng nếu có nhiều giá trị cho mỗi khóa. - Pavel Nikolov
@PavelNikolov Tôi nghĩ rằng nó sẽ giới thiệu những khó khăn nhận được đôi khi một mảng và đôi khi một giá trị. Bạn sẽ phải kiểm tra nó trước, bây giờ bạn chỉ kiểm tra độ dài, bởi vì bạn sẽ sử dụng các chu kỳ để lấy các giá trị anyways. Đây cũng có nghĩa là giải pháp đơn giản nhất, nhưng chức năng ở đây. - Qwerty
@twig sẽ không hoạt động trong IE8 - sqram
Flattened ra một chút cho dễ đọc, được thực hiện vào một chức năng, và tái sử dụng chia cuộc gọi: function parseQueryString () {var qd = {}; vị trí (1). 1]); (k trong qd)? Qd [k] .push (v): qd [k] = [v,]}); trả lại qd; } - Casey
decodeDocumentURI (undefined) trả về "undefined" thay vì undefined. Một bản vá chức năng nhưng không phải rất thanh lịch: 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


Roshambo trên snippet.com có ​​một kịch bản đơn giản để đạt được điều này được mô tả trong Nhận thông số URL với jQuery | Cải tiến. Với kịch bản của mình, bạn cũng dễ dàng lấy ra chỉ các tham số bạn muốn.

Đây là ý chính:

$.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;
}

Sau đó, chỉ cần lấy thông số của bạn từ chuỗi truy vấn.

Vì vậy, nếu chuỗi URL / truy vấn cũ là xyz.com/index.html?lang=de.

Chỉ cần gọi var langval = $.urlParam('lang');và bạn đã có nó.

UZBEKJON cũng có một bài đăng trên blog tuyệt vời về điều này, Nhận thông số và giá trị URL với jQuery.


215



với jQuery dường như có nghĩa là không gian tên hàm cho đối tượng jQuery. Ngoài ra, tại sao giá trị không hợp lệ 0? Chắc chắn, tôi có thể sử dụng kiểm tra bình đẳng nghiêm ngặt, nhưng không nên null ? - alex
Đã đồng ý. Nó hoạt động giống như một tham chiếu biến javascript bình thường theo cách đó (ngoại trừ có thể trở về không xác định sẽ chính xác hơn). - Isochronous
'name' không được thoát đúng cách, nó chỉ được tiêm trực tiếp vào RegExp. Điều này không thành công. Giống như những người khác đã nói, đó là những câu trả lời không thể tin được là phát minh lại bánh xe và nhận được rất nhiều phiếu bầu, khi điều này nên được thực hiện trong một thư viện được thử nghiệm tốt. - Triynko