获取转义的URL参数

我正在寻找一个jQuery插件,可以获得URL参数,并支持这个搜索字符串而不输出JavaScript错误:“畸形的URI序列”。如果没有jQuery插件支持这一点,我需要知道如何修改它来支持这一点。

?search=%E6%F8%E5

URL参数的值,当解码时,应该是:

æøå

(人物是挪威人)。

我没有访问服务器的权限,所以我不能在上面修改任何东西。

367717 次浏览

你可以使用浏览器原生的location.search属性:

function getParameter(paramName) {
var searchString = window.location.search.substring(1),
i, val, params = searchString.split("&");


for (i=0;i<params.length;i++) {
val = params[i].split("=");
if (val[0] == paramName) {
return unescape(val[1]);
}
}
return null;
}

但是有一些jQuery插件可以帮助你:

function getURLParameter(name) {
return decodeURI(
(RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
);
}

基于999的答案:

function getURLParameter(name) {
return decodeURIComponent(
(location.search.match(RegExp("[?|&]"+name+'=(.+?)(&|$)'))||[,null])[1]
);
}

变化:

  • decodeURI()替换为decodeURIComponent()
  • [?|&]被添加在regexp的开头
function getURLParameters(paramName)
{
var sURL = window.document.URL.toString();
if (sURL.indexOf("?") > 0)
{
var arrParams = sURL.split("?");
var arrURLParams = arrParams[1].split("&");
var arrParamNames = new Array(arrURLParams.length);
var arrParamValues = new Array(arrURLParams.length);
var i = 0;
for (i=0;i<arrURLParams.length;i++)
{
var sParam =  arrURLParams[i].split("=");
arrParamNames[i] = sParam[0];
if (sParam[1] != "")
arrParamValues[i] = unescape(sParam[1]);
else
arrParamValues[i] = "No Value";
}


for (i=0;i<arrURLParams.length;i++)
{
if(arrParamNames[i] == paramName){
//alert("Param:"+arrParamValues[i]);
return arrParamValues[i];
}
}
return "No Parameters Found";
}


}

以下是我从这里的评论中创建的内容,以及修复没有提到的错误(例如实际返回null,而不是'null'):

function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
}

如果你不知道URL参数是什么,并且想要获得一个包含参数中的键和值的对象,你可以使用这个:

function getParameters() {
var searchString = window.location.search.substring(1),
params = searchString.split("&"),
hash = {};


if (searchString == "") return {};
for (var i = 0; i < params.length; i++) {
var val = params[i].split("=");
hash[unescape(val[0])] = unescape(val[1]);
}
return hash;
}

使用/posts?date=9/10/11&author=nilbus这样的url调用getParameters()将返回:

{
date:   '9/10/11',
author: 'nilbus'
}

我不会在这里包括代码,因为它甚至远离问题,但weareon.net发布了一个库,允许操作URL中的参数:

$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(top.window.location.href);
return (results !== null) ? results[1] : 0;
}


$.urlParam("key");

你真正需要的是jQuery URL解析插件。使用这个插件,获取特定URL参数的值(对于当前URL)看起来像这样:

$.url().param('foo');

如果你想要一个以参数名为键,以参数值为值的对象,你只需要调用param()而不带参数,就像这样:

$.url().param();

这个库也适用于其他url,而不仅仅是当前的url:

$.url('http://allmarkedup.com?sky=blue&grass=green').param();
$('#myElement').url().param(); // works with elements that have 'src', 'href' or 'action' attributes

因为这是一个完整的URL解析库,你也可以从URL中获得其他信息,比如指定的端口,或者路径,协议等:

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

它还有其他特性,查看它的主页以获得更多的文档和示例。

不要为这个特定的目的(有点大多数情况下工作)编写自己的URI解析器,而是使用一个实际的URI解析器。根据答案的不同,来自其他答案的代码可以返回'null'而不是null,不能与空参数(?foo=&bar=x)一起工作,不能一次解析并返回所有参数,如果你反复查询参数的URL,则重复该工作等。

使用实际的URI解析器,不要自己发明。

对于那些不喜欢jQuery的人,有一个纯JS的插件版本

我创建了一个简单的函数,从JavaScript的URL中获取URL参数,如下所示:

.....58e/web/viewer.html?page=*17*&getinfo=33




function buildLinkb(param) {
var val = document.URL;
var url = val.substr(val.indexOf(param))
var n=parseInt(url.replace(param+"=",""));
alert(n+1);
}
buildLinkb("page");

输出:18

这可能会有所帮助。

<script type="text/javascript">
$(document).ready(function(){
alert(getParameterByName("third"));
});
function getParameterByName(name){
var url     = document.URL,
count   = url.indexOf(name);
sub     = url.substring(count);
amper   = sub.indexOf("&");


if(amper == "-1"){
var param = sub.split("=");
return param[1];
}else{
var param = sub.substr(0,amper).split("=");
return param[1];
}


}
</script>

以防你们有localhost/index。xsp这样的url ?A =1#一些东西,你需要得到参数而不是哈希值。

var vars = [], hash, anchor;
var q = document.URL.split('?')[1];
if(q != undefined){
q = q.split('&');
for(var i = 0; i < q.length; i++){
hash = q[i].split('=');
anchor = hash[1].split('#');
vars.push(anchor[0]);
vars[hash[0]] = anchor[0];
}
}

需要添加参数i,使其不区分大小写:

  function getURLParameter(name) {
return decodeURIComponent(
(RegExp(name + '=' + '(.+?)(&|$)', 'i').exec(location.search) || [, ""])[1]
);
}

例如,返回任意参数变量值的函数。

function GetURLParameter(sParam)
{
var sPageURL = window.location.search.substring(1);
var sURLVariables = sPageURL.split('&');
for (var i = 0; i < sURLVariables.length; i++)
{
var sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] == sParam)
{
return sParameterName[1];
}
}
}​

这就是你如何使用这个函数假设URL是,

“http://example.com/?technology=jquery&博客= jquerybyexample”。

var tech = GetURLParameter('technology');
var blog = GetURLParameter('blog');

所以在上面的代码变量"tech"将有"jQuery"作为值和"blog"变量的将是" querybyexample"。

在阅读了所有的答案后,我最终得到了这个版本+第二个使用参数作为标志的函数

function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)','i').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
}


function isSetURLParameter(name) {
return (new RegExp('[?|&]' + name + '(?:[=|&|#|;|]|$)','i').exec(location.search) !== null)
}

这里有很多有bug的代码,正则表达式解决方案非常慢。我发现了一个解决方案,比正则表达式对应的工作速度快20倍,而且非常简单:

    /*
*   @param      string      parameter to return the value of.
*   @return     string      value of chosen parameter, if found.
*/
function get_param(return_this)
{
return_this = return_this.replace(/\?/ig, "").replace(/=/ig, ""); // Globally replace illegal chars.


var url = window.location.href;                                   // Get the URL.
var parameters = url.substring(url.indexOf("?") + 1).split("&");  // Split by "param=value".
var params = [];                                                  // Array to store individual values.


for(var i = 0; i < parameters.length; i++)
if(parameters[i].search(return_this + "=") != -1)
return parameters[i].substring(parameters[i].indexOf("=") + 1).split("+");


return "Parameter not found";
}


console.log(get_param("parameterName"));

Regex并不是最重要的解决方案,对于这类问题,简单的字符串操作可以更有效地工作。代码源

@pauloppenheim对答案进行了轻微修改,因为它不能正确处理可能是其他参数名称的一部分的参数名称。

如果你有“阑尾”&“env”参数,还原为“env”的值可以拾取“appenv”的值。

解决办法:

var urlParamVal = function (name) {
var result = RegExp("(&|\\?)" + name + "=(.+?)(&|$)").exec(location.search);
return result ? decodeURIComponent(result[2]) : "";
};
<script type="text/javascript">
function getURLParameter(name) {
return decodeURIComponent(
(location.search.toLowerCase().match(RegExp("[?|&]" + name + '=(.+?)(&|$)')) || [, null])[1]
);
}


</script>

getURLParameter(id)getURLParameter(Id)工作相同:)

< p > 你不应该使用jQuery来做这样的事情! < br > 现代的方法是通过包管理器(如Bower)使用小型可重用模块

我已经创建了一个微小的模块,它可以将查询字符串解析为对象。像这样使用它:

// parse the query string into an object and get the property
queryString.parse(unescape(location.search)).search;
//=> æøå

jQuery代码片段,以获取动态变量存储在url作为参数,并将它们存储为JavaScript变量,以供您的脚本使用:

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


example.com?param1=name&param2=&id=6


$.urlParam('param1'); // name
$.urlParam('id');        // 6
$.urlParam('param2');   // null


//example params with spaces
http://www.jquery4u.com?city=Gold Coast
console.log($.urlParam('city'));
//output: Gold%20Coast


console.log(decodeURIComponent($.urlParam('city')));
//output: Gold Coast