Usando el parámetro GET de una URL en JavaScript [duplicado]
-
05-07-2019 - |
Pregunta
Esta pregunta ya tiene una respuesta aquí:
Si estoy en una página como
http://somesite.com/somepage.php?param1=asdf
En el JavaScript de esa página, me gustaría establecer una variable en el valor del parámetro en la parte GET de la URL.
Entonces en JavaScript:
<script>
param1var = ... // ... would be replaced with the code to get asdf from URI
</script>
¿Qué " " " ser?
Solución
Aquí hay algunos código de muestra para eso.
<script>
var param1var = getQueryVariable("param1");
function getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
alert('Query Variable ' + variable + ' not found');
}
</script>
Otros consejos
Puedes obtener la " búsqueda " parte del objeto de ubicación, y luego analizarlo.
var matches = /param1=([^&#=]*)/.exec(window.location.search);
var param1 = matches[1];
Hice esta variación de la solución de gnarf, por lo que la llamada y el resultado son similares a PHP:
function S_GET(id){
var a = new RegExp(id+"=([^&#=]*)");
return decodeURIComponent(a.exec(window.location.search)[1]);
}
Pero al ser llamado en una función, el proceso es más lento, es mejor usarlo como global:
window['
var_name '] = decodeURIComponent (/
var_in_get = ([^ & amp ; # =] *) /. exec (window.location.search) [1]);
ACTUALIZAR
Mientras sigo aprendiendo JS, creé una mejor respuesta en un comportamiento más JS:
Url = {
get get(){
var vars= {};
if(window.location.search.length!==0)
window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){
key=decodeURIComponent(key);
if(typeof vars[key]==="undefined") {vars[key]= decodeURIComponent(value);}
else {vars[key]= [].concat(vars[key], decodeURIComponent(value));}
});
return vars;
}
};
Esto se puede llamar simplemente usando Url.get
.
Ejemplo
La url ? Param1 = param1Value & amp; param2 = param2Value
Se puede llamar como:
Url.get.param1 //"param1Value"
Url.get.param2 //"param2Value"
aquí hay un snipet:
// URL GET params
url = "?a=2&a=3&b=2&a=4";
Url = {
get get(){
var vars= {};
if(url.length!==0)
url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){
key=decodeURIComponent(key);
if(typeof vars[key]==="undefined") {vars[key]= decodeURIComponent(value);}
else {vars[key]= [].concat(vars[key], decodeURIComponent(value));}
});
return vars;
}
};
document.querySelector('log').innerHTML = JSON.stringify(Url.get);
<log></log>
Desde mi archivo de programación:
function querystring(key) {
var re=new RegExp('(?:\\?|&)'+key+'=(.*?)(?=&|$)','gi');
var r=[], m;
while ((m=re.exec(document.location.search)) != null) r[r.length]=m[1];
return r;
}
Si el valor no existe, se devuelve una matriz vacía.
Si el valor existe, se devuelve una matriz que tiene un elemento, el valor.
Si existen varios valores con el nombre, se devuelve una matriz que contiene cada valor.
Ejemplos:
var param1var = querystring("param1")[0];
document.write(querystring("name"));
if (querystring('id')=='42') alert('We apoligize for the inconvenience.');
if (querystring('button').length>0) alert(querystring('info'));
A continuación le indicamos cómo puede hacerlo en Coffee Script (solo si alguien está interesado).
decodeURIComponent( v.split( "=" )[1] ) if decodeURIComponent( v.split( "=" )[0] ) == name for v in window.location.search.substring( 1 ).split( "&" )
¿Usando jquery? He usado esto antes: http://projects.allmarkedup.com/jquery_url_parser/ y funcionó bastante bien
Esto se veía bien:
function gup( name ){
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null )
return "";
else
return results[1];
}
Aquí hay una versión que le gusta a JSLint:
/*jslint browser: true */
var GET = {};
(function (input) {
'use strict';
if (input.length > 1) {
var param = input.slice(1).replace(/\+/g, ' ').split('&'),
plength = param.length,
tmp,
p;
for (p = 0; p < plength; p += 1) {
tmp = param[p].split('=');
GET[decodeURIComponent(tmp[0])] = decodeURIComponent(tmp[1]);
}
}
}(window.location.search));
window.alert(JSON.stringify(GET));
O si necesita soporte para varios valores para una tecla como, por ejemplo, ? key = value1 & amp; key = value2 puedes usar esto:
/*jslint browser: true */
var GET = {};
(function (input) {
'use strict';
if (input.length > 1) {
var params = input.slice(1).replace(/\+/g, ' ').split('&'),
plength = params.length,
tmp,
key,
val,
obj,
p;
for (p = 0; p < plength; p += 1) {
tmp = params[p].split('=');
key = decodeURIComponent(tmp[0]);
val = decodeURIComponent(tmp[1]);
if (GET.hasOwnProperty(key)) {
obj = GET[key];
if (obj.constructor === Array) {
obj.push(val);
} else {
GET[key] = [obj, val];
}
} else {
GET[key] = val;
}
}
}
}(window.location.search));
window.alert(JSON.stringify(GET));
Puedes usar esta función
function getParmFromUrl(url, parm) {
var re = new RegExp(".*[?&]" + parm + "=([^&]+)(&|$)");
var match = url.match(re);
return(match ? match[1] : "");
}
Si ya estás ejecutando una página php, entonces
bit php:
$json = json_encode( Si ya estás ejecutando una página php, entonces
bit php:
var param1var = getVars.param1var;
js bit:
<*>
Pero para las páginas Html, la solución de José Basilio me parece bien.
¡Buena suerte!
REQUEST, JSON_FORCE_OBJECT);
print "<script>var getVars = $json;</script>";
js bit:
<*>Pero para las páginas Html, la solución de José Basilio me parece bien.
¡Buena suerte!
No necesitas hacer nada especial, en realidad. Puede combinar JavaScript y PHP para obtener variables de PHP directamente en JavaScript.
var param1val = '<?php echo No necesitas hacer nada especial, en realidad. Puede combinar JavaScript y PHP para obtener variables de PHP directamente en JavaScript.
<*>GET['param1'] ?>';