如何从JavaScript检索GET参数

考虑:

http://example.com/page.html?returnurl=%2Fadmin

对于page.html内的js，它如何检索GET参数?

对于上面的简单例子，func('returnurl')应该是/admin。

但它也应该适用于复杂的查询字符串…

当前回答

我这样做(检索一个特定的get-parameter，这里'parameterName'):

var parameterValue = decodeURIComponent(window.location.search.match(/(\?|&)parameterName\=([^&]*)/)[2]);

2014-11-18 13:02:06

其他回答

在这里，我用这段代码将GET参数转换为一个对象，以便更容易地使用它们。

// Get Nav URL
function getNavUrl() {
    // Get URL
    return window.location.search.replace("?", "");
};

function getParameters(url) {
    // Params obj
    var params = {};
    // To lowercase
    url = url.toLowerCase();
    // To array
    url = url.split('&');

    // Iterate over URL parameters array
    var length = url.length;
    for(var i=0; i<length; i++) {
        // Create prop
        var prop = url[i].slice(0, url[i].search('='));
        // Create Val
        var value = url[i].slice(url[i].search('=')).replace('=', '');
        // Params New Attr
        params[prop] = value;
    }
    return params;
};

// Call of getParameters
console.log(getParameters(getNavUrl()));

2016-07-26 19:13:32

我这样做(检索一个特定的get-parameter，这里'parameterName'):

var parameterValue = decodeURIComponent(window.location.search.match(/(\?|&)parameterName\=([^&]*)/)[2]);

2014-11-18 13:02:06

dr解决方案在一行代码上使用普通JavaScript

var queryDict = {}
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})

这是最简单的解决方案。不幸的是，它不能处理多值键和编码字符。

"?a=1&a=%2Fadmin&b=2&c=3&d&e"
> queryDict
a: "%2Fadmin"  // Overridden with the last value, not decoded.
b: "2"
c: "3"
d: undefined
e: undefined

多值键和编码字符?

请参阅如何在JavaScript中获得查询字符串值的原始答案。

"?a=1&b=2&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&a=%2Fadmin"
> queryDict
a: ["1", "5", "t e x t", "/admin"]
b: ["2"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

在你的例子中，你可以像这样访问这个值:

"?returnurl=%2Fadmin"
> qd.returnurl    // ["/admin"]
> qd['returnurl'] // ["/admin"]
> qd.returnurl[0] // "/admin"

2014-01-18 22:22:57

用窗户。位置的对象。这段代码提供了不带问号的GET。

window.location.search.substr(1)

在您的示例中，它将返回returnurl=%2Fadmin

编辑:我擅自改变了Qwerty的答案，这真的很好，正如他指出的那样，我完全按照OP的要求做了:

function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    location.search
        .substr(1)
        .split("&")
        .forEach(function (item) {
          tmp = item.split("=");
          if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
        });
    return result;
}

我从他的代码中删除了重复的函数执行，替换为一个变量(tmp)，还添加了decodeURIComponent，完全符合OP的要求。我不确定这是不是安全问题。

或者使用普通的for循环，即使在IE8中也能工作:

function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    var items = location.search.substr(1).split("&");
    for (var index = 0; index < items.length; index++) {
        tmp = items[index].split("=");
        if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
    }
    return result;
}

2011-03-27 10:17:32

我创建了一个简单的JavaScript函数来从URL访问GET参数。

只要包含这个JavaScript源代码，就可以访问get参数。例如:在http://example.com/index.php?language=french中，语言变量可以通过$_GET["language"]访问。类似地，所有参数的列表将作为数组存储在变量$_GET_Params中。JavaScript和HTML都在下面的代码片段中提供:

<!DOCTYPE html> <html> <body>  <script> function $_GET() { // Get the Full href of the page e.g. http://www.google.com/files/script.php?v=1.8.7&country=india var href = window.location.href; // Get the protocol e.g. http var protocol = window.location.protocol + "//"; // Get the host name e.g. www.google.com var hostname = window.location.hostname; // Get the pathname e.g. /files/script.php var pathname = window.location.pathname; // Remove protocol part var queries = href.replace(protocol, ''); // Remove host part queries = queries.replace(hostname, ''); // Remove pathname part queries = queries.replace(pathname, ''); // Presently, what is left in the variable queries is : ?v=1.8.7&country=india // Perform query functions if present if (queries != "" && queries != "?") { // Remove question mark '?' queries = queries.slice(1); // Split all the different queries queries = queries.split("&"); // Get the number of queries var length = queries.length; // Declare global variables to store keys and elements $_GET_Params = new Array(); $_GET = {}; // Perform functions per query for (var i = 0; i < length; i++) { // Get the present query var key = queries[i]; // Split the query and the value key = key.split("="); // Assign value to the $_GET variable $_GET[key[0]] = [key[1]]; // Assign value to the $_GET_Params variable $_GET_Params[i] = key[0]; } } } // Execute the function $_GET(); </script> <h1>GET Parameters</h1> <h2>Try to insert some get parameter and access it through JavaScript</h2> </body> </html>

2016-06-12 02:58:38

如何从JavaScript检索GET参数

推荐文章

最新文章

标签