web-dev-qa-db-fra.com

Ajouter un paramètre sur l'URL actuelle

Je voudrais avoir un petit bouton oeuf de Pâques dans le coin d'un site de projet. Lorsque vous cliquez dessus, il suffit de déposer une chaîne sur l'URL actuelle et de recharger la page.

Donc, si je suis sur: http://test.com/projects/view/134

Le bouton est cliqué

Rechargement de page sur: http://test.com/projects/view/134?ts=true

Je ne sais pas trop comment je pourrais y arriver.

javascriptjqueryappend
20
Fuego DeBassi

essayez ce code,

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

EDITS: Pour éviter la duplication de paramètre ou de très grande chaîne dans votre url, vous devez remplacer le vieux paramètre qui existe déjà.

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

Vous pouvez assigner location.href à la valeur qu’il a actuellement, plus votre nouvelle chaîne de requête:

(édité pour être compatible avec les chaînes de requête existantes) 

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

Ou pour être plus succinct:

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

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

En utilisant:

Exemple:

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();
4
Vianney Bajart
location.href += '?ts=true';

Juste comme ça.

3
Ohas

Utilisez pleinement l’API DOM location et comptez dans le hachage:

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

3
harttle

J'ai trouvé les réponses précédentes manquantes et, en tant que tel, voici une méthode qui gère mieux les autres paramètres de la chaîne de requête courante.

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;
}

Vous devez utiliser location.href = appendToQueryString(ts, true) pour recharger la page.

3
Bobbzorzen

Si vous souhaitez prendre en compte l'existence potentielle d'un hachage "#" dans l'URL, procédez comme suit:

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;
2
fabiangebert

Tu veux dire:


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

Voir la documentation de l'API d'historique:

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

Exemple d'utilisation:

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

1
Babacar Diop

Une amélioration de @Bobbzorzen answer, avec la possibilité de supprimer param en donnant son nom uniquement:

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

0
Envil