ajouter à l'URL et actualiser la page


Réponses:


162

cela devrait fonctionner (non testé!)

var url = window.location.href;    
if (url.indexOf('?') > -1){
   url += '&param=1'
}else{
   url += '?param=1'
}
window.location.href = url;

1
str.search (regex) est plus rapide que srt.indexOf (str2)
xavierm02

1
Et vous devriez donner un exemple ull avec un nom de variable et un paramètre de variable avec encodeURIComponent ().
xavierm02

Et insteand de> -1, vous devriez utiliser! == -1
xavierm02

8
un suivi à cela, comment peut-on ajouter une logique pour que si le paramètre existe déjà dans une URL, je mette à jour sa valeur plutôt que d'ajouter un nouveau paramètre?
amateur

1
cela supprimera l'ancre (valeur de hachage) de l'url, si elle existait, @amateur vous pouvez trouver une fonction qui fait cela ici: stackoverflow.com/questions/486896/…
Doug Molineux

143

Plus court que la réponse acceptée, faire de même, mais en restant simple:

window.location.search += '&param=42';

Nous n'avons pas à modifier l'URL entière, juste la chaîne de requête, connue sous le nom d'attribut de recherche de location.

Lorsque vous attribuez une valeur à l'attribut de recherche, le point d'interrogation est automatiquement inséré par le navigateur et la page est rechargée.


11
Pour un cas où vous savez que ce sera le seul paramètre, vous pouvez également définir la recherche au lieu de lui ajouter:window.location.search = '?param=42';
Dave DuPlantis

1
Bon travail!! La manière correcte, simple et optimisée; aurait dû être la réponse acceptée.
Rohit le

Et si votre URL est: www.monsite.com ... alors ne fera-t-elle pas l'url: www.monsite.com & param = 42 qui aurait besoin du "?" car c'est le seul paramètre de l'url. J'aime la réponse @Shlomi Komemi car elle couvre ces 2 scénarios principaux.
GreaterKing

1
@greaterKing le navigateur ajoute le point d'interrogation, lors de l'ajout de paramètres à l'attribut de recherche de l'emplacement. Essayez-le dans la console de votre navigateur.
Bo Frederiksen

1
Mon mauvais @BoFrederiksen vous avez en effet raison ... désolé à ce sujet. "+ =" de grossier ... raté ça. +1 de moi.
GreaterKing

70

La plupart des réponses ici suggèrent qu'il faut ajouter le (s) paramètre (s) à l'URL, quelque chose comme l'extrait de code suivant ou une variante similaire:

location.href = location.href + "&parameter=" + value;

Cela fonctionnera assez bien pour la majorité des cas.

toutefois

Ce n'est pas la bonne façon d'ajouter un paramètre à une URL à mon avis.

Étant donné que l'approche suggérée ne teste pas si le paramètre est déjà défini dans l'URL, si ce n'est pas prudent, on peut se retrouver avec une URL très longue avec le même paramètre répété plusieurs fois. c'est à dire:

https://stackoverflow.com/?&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1

c'est à ce stade que les problèmes commencent. L'approche suggérée pourrait créer et créera une URL très longue après plusieurs actualisations de page, rendant ainsi l'URL invalide. Suivez ce lien pour plus d'informations sur les URL longues. Quelle est la longueur maximale d'une URL dans différents navigateurs?

Voici mon approche suggérée:

function URL_add_parameter(url, param, value){
    var hash       = {};
    var parser     = document.createElement('a');

    parser.href    = url;

    var parameters = parser.search.split(/\?|&/);

    for(var i=0; i < parameters.length; i++) {
        if(!parameters[i])
            continue;

        var ary      = parameters[i].split('=');
        hash[ary[0]] = ary[1];
    }

    hash[param] = value;

    var list = [];  
    Object.keys(hash).forEach(function (key) {
        list.push(key + '=' + hash[key]);
    });

    parser.search = '?' + list.join('&');
    return parser.href;
}

Avec cette fonction, il suffit de faire ce qui suit:

location.href = URL_add_parameter(location.href, 'param', 'value');

1
Pourquoi ne pas simplement utiliser:if(window.location.search.indexOf('&param=') == -1) {window.location.search += '&param=1';}
538ROMEO

@ SébastienGarcia-Roméo Oui c'est une approche intéressante, et en effet valable, cependant, il y a deux raisons pour lesquelles la fonction est programmée de cette manière. 1. Pour éliminer les paramètres en double existants. 2. Pour écraser la valeur d'un paramètre existant. De ce point de vue, maintenant l'utilisation de indexOfpourrait introduire une complexité inutile au code.
yeyo


2
function gotoItem( item ){
    var url = window.location.href;
    var separator = (url.indexOf('?') > -1) ? "&" : "?";
    var qs = "item=" + encodeURIComponent(item);
    window.location.href = url + separator + qs;
}

Plus de version de compatibilité

function gotoItem( item ){
    var url = window.location.href;    
    url += (url.indexOf('?') > -1)?"&":"?" + "item=" + encodeURIComponent(item);
    window.location.href = url;
}

1

Veuillez vérifier le code ci-dessous:

/*Get current URL*/    
var _url = location.href; 
/*Check if the url already contains ?, if yes append the parameter, else add the parameter*/
_url = ( _url.indexOf('?') !== -1 ) ? _url+'&param='+value : _url+'?param='+value;
/*reload the page */
window.location.href = _url;

1

Une petite correction de bogue pour la réponse réfléchie de @ yeyo ci-dessus.

Changement:

var parameters = parser.search.split(/\?|&/);

À:

var parameters = parser.search.split(/\?|&amp;/);


Veuillez publier ces corrections dans un commentaire ou proposer et modifier. Ils ne justifient pas une réponse distincte.
JJ for Transparency et Monica

1

Essaye ça

var url = ApiUrl(`/customers`);
  if(data){
   url += '?search='+data; 
  }
  else
  { 
      url +=  `?page=${page}&per_page=${perpage}`;
  }
  console.log(url);

0

Aussi:

window.location.href += (window.location.href.indexOf('?') > -1 ? '&' : '?') + 'param=1'

Une seule doublure de réponse Shlomi utilisable dans les bookmarklets

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.