Agregar un parámetro a la URL actual

Question

Me gustaría tener un pequeño botón de huevo de pascua en la esquina del sitio de un proyecto. Cuando se hace clic, simplemente coloca una cadena en la url actual y vuelve a cargar la página.

Así que si estoy en: http://test.com/projects/view/134

se pulsa el botón

recarga de la página en: http://test.com/projects/view/134?ts=true

No es muy seguro cómo podría ir haciendo así que sin embargo.

Answer 1

Puede asignar location.href al valor que tiene en la actualidad, además de su nueva cadena de consulta:

(editado para ser amigable con cadenas de consulta existentes)

$("#yourButtonId").click({ 
    var loc = location.href; 
    if (loc.indexOf("?") === -1) 
     loc += "?"; 
    else 
     loc += "&"; 
    location.href = loc + "ts=true"; 
}); 

O para ser más sucinta:

$("#yourButtonId").click({ 
    var loc = location.href;   
    loc += loc.indexOf("?") === -1 ? "?" : "&"; 

    location.href = loc + "ts=true"; 
}); 

Answer 2

¿Quiere decir:

 

$(document).ready(function() { 
    $("#yourButtonId").click(function() { 
     var currentUrl = window.location.pathname + "?ts=true"; 
    }); 
}); 

 

Answer 3

location.href += '?ts=true'; 

Así como eso.

Answer 4

tratan este código,

var separator = (window.location.href.indexOf("?")===-1)?"?":"&"; 
window.location.href = window.location.href + separator + "ts=true"; 

EDITS: que deben evitarse parámetro duplicado o muy grande cadena en su URL, es necesario sustituir el viejo parámetro ya existe.

var url=window.location.href, 
    separator = (url.indexOf("?")===-1)?"?":"&", 
    newParam=separator + "ts=true"; 
    newUrl=url.replace(newParam,""); 
    newUrl+=newParam; 
    window.location.href =newUrl; 

Answer 5

Si quieres dar cuenta de la posible existencia de un hash "#" en la URL, haga lo siguiente:

var href = location.href; 
var hasQuery = href.indexOf("?") + 1; 
var hasHash = href.indexOf("#") + 1; 
var appendix = (hasQuery ? "&" : "?") + "ts=true"; 
location.href = hasHash ? href.replace("#", appendix + "#") : href + appendix; 

Answer 6

He encontrado las respuestas anteriores que carecen y como tal aquí es un método que maneja mejor demás parámetros de cadena de consulta actual

appendToQueryString = function (param, val) { 
    var queryString = window.location.search.replace("?", ""); 
    var parameterListRaw = queryString == "" ? [] : queryString.split("&"); 
    var parameterList = {}; 
    for (var i = 0; i < parameterListRaw.length; i++) { 
     var parameter = parameterListRaw[i].split("="); 
     parameterList[parameter[0]] = parameter[1]; 
    } 
    parameterList[param] = val; 

    var newQueryString = "?"; 
    for (var item in parameterList) { 
     if (parameterList.hasOwnProperty(item)) { 
      newQueryString += item + "=" + parameterList[item] + "&"; 
     } 
    } 
    newQueryString = newQueryString.replace(/&$/, ""); 
    return location.origin + location.pathname + newQueryString; 
} 

usted tiene que utilizar location.href = appendToQueryString(ts, true) para realmente recargar la página.

Answer 7

Una mejora de la respuesta @Bobbzorzen, con la capacidad de eliminar parámetro pasando sólo su nombre:

function AlterQueryString(param, val) { 
    var queryString = window.location.search.replace("?", ""); 
    var parameterListRaw = queryString == "" ? [] : queryString.split("&"); 
    var parameterList = {}; 
    for (var i = 0; i < parameterListRaw.length; i++) { 
     var parameter = parameterListRaw[i].split("="); 
     if (typeof val != 'undefined') { 
      parameterList[parameter[0]] = parameter[1]; 
     } else if (param != parameter[0]) { 
      parameterList[parameter[0]] = parameter[1]; 
     } 
    } 
    if (typeof val != 'undefined') { 
     parameterList[param] = val; 
    } 

    var newQueryString = Object.keys(parameterList).length > 0 ? "?" : ""; 
    for (var item in parameterList) { 
     if (parameterList.hasOwnProperty(item)) { 
      newQueryString += item + "=" + parameterList[item] + "&"; 
     } 
    } 
    newQueryString = newQueryString.replace(/&$/, ""); 
    return location.origin + location.pathname + newQueryString; 
} 

gist: https://gist.github.com/envil/bc1832503bef55ffdabb0cde32bb06f1

Answer 8

hacer pleno uso de la API DOM location, y contar en picadillo:

location.protocol + '//' + location.pathname + 
 
    (location.search ? location.search + '&a=b' : '?a=b') + 
 
    location.hash;

Answer 9

Usando:

• https://developer.mozilla.org/en-US/docs/Web/API/URL
• https://developer.mozilla.org/fr/docs/Web/API/URLSearchParams

Ejemplo:

var url = new URL("http://foo.bar/?x=1&y=2"); 

// If your expected result is "http://foo.bar/?x=1&y=2&x=42" 
url.searchParams.append('x', 42); 

// If your expected result is "http://foo.bar/?x=42&y=2" 
url.searchParams.set('x', 42); 

// Build result 
url.toString(); 

Answer 10

Consulte la documentación de la API de la historia:

https://developer.mozilla.org/en-US/docs/Web/API/History_API

Ejemplo de uso:

var obj = { Title: title, Url: url }; history.pushState(obj, obj.Title, obj.Url);