jquery - por - obtener url javascript

Obtener url parámetro jquery o cómo obtener valores de cadena de consulta en js

Question

He visto muchos ejemplos de jQuery donde se desconocen el tamaño y el nombre de los parámetros. Mi url solo va a tener una cadena:

http://example.com?sent=yes

Solo quiero detectar:

1. ¿Existe el sent ?
2. ¿Es igual a "sí"?

Answer 1

¿Qué pasa si hay & en el parámetro de URL como filename = "p & g.html" & uid = 66

En este caso, la primera función no funcionará correctamente. Así que modifiqué el código.

function getUrlParameter(sParam) {
var sURLVariables = window.location.search.substring(1).split(''&''), sParameterName, i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split(''='');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
}
}
}

Answer 2

¿Quizás quieras echarle un vistazo al dentista JS ? (descargo de responsabilidad: escribí el código)

código:

document.URL == "http://helloworld.com/quotes?id=1337&author=kelvin&message=hello"
var currentURL = document.URL;
var params = currentURL.extract();
console.log(params.id); // 1337
console.log(params.author) // "kelvin"
console.log(params.message) // "hello"

con Dentist JS, básicamente puede llamar a la función extract () en todas las cadenas (por ejemplo, document.URL.extract ()) y volverá a tener un HashMap de todos los parámetros encontrados. También es personalizable para tratar con delimitadores y todo.

Versión reducida <1kb

Answer 3

Con JavaScript de vainilla, podría tomar fácilmente los parámetros (location.search), obtener la subcadena (sin la?) Y convertirla en una matriz, dividiéndola por ''&''.

A medida que recorre urlParams, puede volver a dividir la cadena con ''='' y agregarla al objeto ''params'' como objeto [elemento [0]] = elemento [1]. Súper simple y de fácil acceso.

http://www.website.com/?error=userError&type=handwritten

 var urlParams = location.search.substring(1).split(''&''),
params = {};
urlParams.forEach(function(el){
var tmpArr = el.split(''='');
params[tmpArr[0]] = tmpArr[1];
});
var error = params[''error''];
var type = params[''type''];

Answer 4

Es cierto que estoy agregando mi respuesta a una pregunta con respuesta excesiva, pero esto tiene las ventajas de:

- No depende de ninguna biblioteca externa, incluyendo jQuery

- No contamina el espacio de nombres de la función global, extendiendo ''String''

- No crear datos globales y realizar un procesamiento innecesario después de encontrar la coincidencia

- Manejar los problemas de codificación y aceptar (suponiendo) un nombre de parámetro no codificado

- Evitar explícitos for loops.

String.prototype.urlParamValue = function() {
var desiredVal = null;
var paramName = this.valueOf();
window.location.search.substring(1).split(''&'').some(function(currentValue, _, _) {
var nameVal = currentValue.split(''='');
if ( decodeURIComponent(nameVal[0]) === paramName ) {
desiredVal = decodeURIComponent(nameVal[1]);
return true;
}
return false;
});
return desiredVal;
};

Entonces lo usarías como:

var paramVal = "paramName".urlParamValue() // null if no match

Answer 5

Espero que esto sea de ayuda.

 <script type="text/javascript">
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;
}
$(window).load(function() {
var param = getParameters();
if (typeof param.sent !== "undefined") {
// Do something.
}
});
</script>

Answer 6

Este es simple y funcionó para mí.

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

entonces si tu url es http://www.yoursite.com?city=4

prueba esto

console.log($.urlParam(''city''));

Answer 7

Esto le dará un buen objeto para trabajar

 function queryParameters () {
var result = {};
var params = window.location.search.split(//?|/&/);
params.forEach( function(it) {
if (it) {
var param = it.split("=");
result[param[0]] = param[1];
}
});
return result;
}

Y entonces;

 if (queryParameters().sent === ''yes'') { .....

Answer 8

Esto podría ser una exageración, pero ahora hay una biblioteca bastante popular para analizar las URI, llamada github.com/medialize/URI.js

Ejemplo

var uri = "http://example.org/foo.html?technology=jquery&technology=css&blog=";
var components = URI.parse(uri);
var query = URI.parseQuery(components[''query'']);
document.getElementById("result").innerHTML = "URI = " + uri;
document.getElementById("result").innerHTML += "<br>technology = " + query[''technology''];
// If you look in your console, you will see that this library generates a JS array for multi-valued queries!
console.log(query[''technology'']);
console.log(query[''blog'']);

<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.17.0/URI.min.js"></script>
<span id="result"></span>

Answer 9

Esto se basa en la respuesta de Gazoris , pero la URL decodifica los parámetros para que puedan usarse cuando contienen datos que no sean números y letras:

function urlParam(name){
var results = new RegExp(''[/?&]'' + name + ''=([^&#]*)'').exec(window.location.href);
// Need to decode the URL parameters, including putting in a fix for the plus sign
// https://.com/a/24417399
return results ? decodeURIComponent(results[1].replace(//+/g, ''%20'')) : null;
}

Answer 10

Fragmento de código de jQuery para obtener las variables dinámicas almacenadas en la url como parámetros y almacenarlas como variables de JavaScript listas para usar con sus scripts:

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

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

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

ejemplo params con espacios

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

Answer 11

Hay otro ejemplo con el uso de la biblioteca URI.js

Ejemplo responde a las preguntas exactamente como se hizo.

var url = ''http://example.com?sent=yes'';
var urlParams = new URI(url).search(true);
// 1. Does sent exist?
var sendExists = urlParams.sent !== undefined;
// 2. Is it equal to "yes"?
var sendIsEqualtToYes = urlParams.sent == ''yes'';
// output results in readable form
// not required for production
if (sendExists) {
console.log(''Url has "sent" param, its value is "'' + urlParams.sent + ''"'');
if (urlParams.sent == ''yes'') {
console.log(''"Sent" param is equal to "yes"'');
} else {
console.log(''"Sent" param is not equal to "yes"'');
}
} else {
console.log(''Url hasn/'t "sent" param'');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.18.2/URI.min.js"></script>

Answer 12

Hay una gran biblioteca: https://github.com/allmarkedup/purl

lo que te permite hacer simplemente

url = ''http://example.com?sent=yes'';
sent = $.url(url).param(''sent'');
if (typeof sent != ''undefined'') { // sent exists
if (sent == ''yes'') { // sent is equal to yes
// ...
}
}

El ejemplo es asumir que estás usando jQuery. También podría usarlo como un simple javascript, la sintaxis sería un poco diferente.

Answer 13

La mejor solución here .

var getUrlParameter = function getUrlParameter(sParam) {
var sPageURL = window.location.search.substring(1),
sURLVariables = sPageURL.split(''&''),
sParameterName,
i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split(''='');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
}
}
};

Y así es como puedes usar esta función asumiendo que la URL es,
http://dummy.com/?technology=jquery&blog=jquerybyexample .

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

Answer 14

O puede usar esta pequeña y elegante función, porque ¿ por qué soluciones demasiado complicadas?

function getQueryParam(param) {
location.search.substr(1)
.split("&")
.some(function(item) { // returns first occurence and stops
return item.split("=")[0] == param && (param = item.split("=")[1])
})
return param
}

que se ve aún mejor cuando está simplificado y onelined:

tl; dr solución de una línea

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

result: queryDict[''sent''] // undefined or ''value''

¿Pero qué pasa si tienes caracteres codificados o claves multivalor ?

Será mejor que vea esta respuesta: ¿Cómo puedo obtener valores de cadena de consulta en JavaScript?

Escurrir el bulto

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

Answer 15

Otra función alternativa ...

function param(name) {
return (location.search.split(name + ''='')[1] || '''').split(''&'')[0];
}

Answer 16

Otra solución que utiliza jQuery y JSON, para que pueda acceder a los valores de los parámetros a través de un objeto.

var loc = window.location.href;
var param = {};
if(loc.indexOf(''?'') > -1)
{
var params = loc.substr(loc.indexOf(''?'')+1, loc.length).split("&");
var stringJson = "{";
for(var i=0;i<params.length;i++)
{
var propVal = params[i].split("=");
var paramName = propVal[0];
var value = propVal[1];
stringJson += "/""+paramName+"/": /""+value+"/"";
if(i != params.length-1) stringJson += ",";
}
stringJson += "}";
// parse string with jQuery parseJSON
param = $.parseJSON(stringJson);
}

Suponiendo que su URL es http://example.com/?search=hello+world&language=en&page=3

Después de eso solo es cuestión de usar los parámetros como este:

param.language

regresar

en

El uso más útil de esto es ejecutarlo en la carga de la página y hacer uso de una variable global para usar los parámetros en cualquier lugar que pueda necesitarlos.

Si su parámetro contiene valores numéricos, simplemente analice el valor.

parseInt(param.page)

Si no hay parámetros, solo habrá un objeto vacío.

Answer 17

Pruebe esta demostración de trabajo http://jsfiddle.net/xy7cX/

API:

• inArray : http://api.jquery.com/jQuery.inArray/

Esto debería ayudar :)

código

var url = "http://myurl.com?sent=yes"
var pieces = url.split("?");
alert(pieces[1] + " ===== " + $.inArray("sent=yes", pieces));

Answer 18

Puede que sea demasiado tarde. Pero este método es muy fácil y simple.

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.url.js"></script>
<!-- URL: www.example.com/correct/?message=done&year=1990 -->
<script type="text/javascript">
$(function(){
$.url.attr(''protocol'') // --> Protocol: "http"
$.url.attr(''path'') // --> host: "www.example.com"
$.url.attr(''query'') // --> path: "/correct/"
$.url.attr(''message'') // --> query: "done"
$.url.attr(''year'') // --> query: "1990"
});

ACTUALIZAR
Requiere el complemento url: plugins.jquery.com/url
Gracias -Ripounet

Answer 19

Si desea encontrar un parámetro específico de una url específica:

function findParam(url, param){
var check = "" + param;
if(url.search(check )>=0){
return url.substring(url.search(check )).split(''&'')[0].split(''='')[1];
}
}
var url = "http://www.yourdomain.com/example?id=1&order_no=114&invoice_no=254";
alert(findParam(url,"order_no"));

Answer 20

Siempre me quedo esto como una sola línea. Ahora params tiene las vars:

params={};location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){params[k]=v})

multilínea:

var params={};
window.location.search
.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(str,key,value) {
params[key] = value;
}
);

como una función

function getSearchParams(k){
var p={};
location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){p[k]=v})
return k?p[k]:p;
}

que podrías usar como:

getSearchParams() //returns {key1:val1, key2:val2}

o

getSearchParams("key1") //returns val1

Answer 21

Solución desde 2018

Tenemos: http://example.com?sent=yes

let searchParams = new URLSearchParams(window.location.search)

¿Existe el envío ?

searchParams.has(''sent'') // true

¿Es igual a "sí"?

let param = searchParams.get(''sent'')

y luego simplemente compararlo.

Answer 22

Tan simple que puedes usar cualquier url y obtener valor.

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

Ejemplo de uso

// query string: ?first=value1&second=&value2
var foo = getParameterByName(''first''); // "value1"
var bar = getParameterByName(''second''); // "value2"

Nota: Si un parámetro está presente varias veces (? Primero = valor1 y segundo = valor2), obtendrá el primer valor (valor1) y el segundo valor como (valor2).

Answer 23

Una ligera mejora en la respuesta de Sameer, los parámetros de caché se cierran para evitar analizar y recorrer todos los parámetros cada vez que se realiza una llamada

var getURLParam = (function() {
var paramStr = decodeURIComponent(window.location.search).substring(1);
var paramSegs = paramStr.split(''&'');
var params = [];
for(var i = 0; i < paramSegs.length; i++) {
var paramSeg = paramSegs[i].split(''='');
params[paramSeg[0]] = paramSeg[1];
}
console.log(params);
return function(key) {
return params[key];
}
})();

Answer 24

Utilizando URLSearchParams :

var params = new window.URLSearchParams(window.location.search);
console.log(params.get(''name''));

Answer 25

Versión en coffeescript de la respuesta de Sameer

getUrlParameter = (sParam) ->
sPageURL = window.location.search.substring(1)
sURLVariables = sPageURL.split(''&'')
i = 0
while i < sURLVariables.length
sParameterName = sURLVariables[i].split(''='')
if sParameterName[0] == sParam
return sParameterName[1]
i++

Answer 26

Yo uso esto y funciona. http://codesheet.org/codesheet/NF246Tzs

function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
var first = getUrlVars()["id"];

Answer 27

utilizar esta

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

Answer 28

function GetRequestParam(param)
{
var res = null;
try{
var qs = decodeURIComponent(window.location.search.substring(1));//get everything after then ''?'' in URI
var ar = qs.split(''&'');
$.each(ar, function(a, b){
var kv = b.split(''='');
if(param === kv[0]){
res = kv[1];
return false;//break loop
}
});
}catch(e){}
return res;
}

Answer 29

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

Answer 30

http://example.com?sent=yes

La mejor solución here .

function getUrlParameter(name) {
name = name.replace(/[/[]/, ''//['').replace(/[/]]/, ''//]'');
var regex = new RegExp(''[//?&]'' + name + ''=([^&#]*)'');
var results = regex.exec(location.search);
return results === null ? '''' : decodeURIComponent(results[1].replace(//+/g, '' ''));
};

Con la función anterior, puede obtener valores de parámetros individuales:

getUrlParameter(''sent'');