an URL anhängen und Seite aktualisieren

134

Ich möchte ein Stück Javascript schreiben, das einen Parameter an die aktuelle URL anfügt und dann die Seite aktualisiert. Wie kann ich das tun?

Amateur
quelle
Die optimierteste Lösung, die ich gefunden habe: stackoverflow.com/a/38792165/1783439
nu everest

Antworten:

162

das sollte funktionieren (nicht getestet!)

var url = window.location.href;    
if (url.indexOf('?') > -1){
   url += '&param=1'
}else{
   url += '?param=1'
}
window.location.href = url;
Shlomi Komemi
quelle
1
str.search (regex) ist schneller als srt.indexOf (str2)
xavierm02
1
Und Sie sollten ein vollständiges Beispiel mit einem Variablennamen und einem Variablenparameter mit encodeURIComponent () geben.
Xavierm02
Und insteand von> -1 sollten Sie verwenden! == -1
xavierm02
8
Wie kann man eine Logik hinzufügen, dass, wenn der Parameter bereits in einer URL vorhanden ist, ich seinen Wert aktualisiere, anstatt einen neuen Parameter hinzuzufügen?
Amateur
1
Dadurch wird der Anker (Hash-Wert) von der URL entfernt. Wenn er vorhanden ist, finden Sie hier eine Funktion, die dies tut: stackoverflow.com/questions/486896/…
Doug Molineux
143

Kürzer als die akzeptierte Antwort, das Gleiche tun, aber einfach halten:

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

Wir müssen nicht die gesamte URL ändern, sondern nur die Abfragezeichenfolge, die als Suchattribut des Standorts bezeichnet wird.

Wenn Sie dem Suchattribut einen Wert zuweisen, wird das Fragezeichen automatisch vom Browser eingefügt und die Seite neu geladen.

Bo Frederiksen
quelle
11
In einem Fall, in dem Sie wissen, dass dies der einzige Parameter ist, können Sie auch die Suche festlegen, anstatt sie window.location.search = '?param=42';
anzuhängen
1
Gut gemacht!! Der richtige, einfachste und optimierte Weg; sollte die akzeptierte Antwort gewesen sein.
Rohit
Was ist, wenn Ihre URL lautet: www.mysite.com ... wird dann nicht die URL www.mysite.com & param = 42 erstellt, für die das "?" Zeichen, da es der einzige Parameter in der URL ist. Ich mag die Antwort von @Shlomi Komemi, da sie diese beiden Hauptszenarien abdeckt.
GreaterKing
1
@greaterKing Der Browser fügt das Fragezeichen hinzu, wenn dem Suchattribut des Standorts Parameter hinzugefügt werden. Probieren Sie es in der Browserkonsole aus.
Bo Frederiksen
1
Mein schlechtes @BoFrederiksen du hast ja recht ... srry darüber. "+ =" von grob ... habe das verpasst. +1 von mir.
GreaterKing
70

Die meisten Antworten hier schlagen vor, dass man die Parameter an die URL anhängen sollte, etwa das folgende Snippet oder eine ähnliche Variante:

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

Dies wird in den meisten Fällen recht gut funktionieren.

jedoch

Das ist meiner Meinung nach nicht der richtige Weg, einen Parameter an eine URL anzuhängen.

Da der vorgeschlagene Ansatz nicht testet, ob der Parameter bereits in der URL festgelegt ist, kann es bei Nichtbeachtung zu einer sehr langen URL kommen, bei der derselbe Parameter mehrmals wiederholt wird. dh:

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

An diesem Punkt beginnen die Probleme. Der vorgeschlagene Ansatz könnte und wird nach mehreren Seitenaktualisierungen eine sehr lange URL erstellen, wodurch die URL ungültig wird. Folgen Sie diesem Link, um weitere Informationen zu langen URLs zu erhalten. Wie lang ist eine URL in verschiedenen Browsern maximal?

Dies ist mein vorgeschlagener Ansatz:

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

Mit dieser Funktion muss man nur Folgendes tun:

location.href = URL_add_parameter(location.href, 'param', 'value');
yeyo
quelle
1
Warum nicht einfach verwenden:if(window.location.search.indexOf('&param=') == -1) {window.location.search += '&param=1';}
538ROMEO
@ SébastienGarcia-Roméo Ja, das ist ein interessanter Ansatz, und zwar gültig, es gibt jedoch zwei Gründe, warum die Funktion auf diese Weise programmiert wird. 1. Vorhandene doppelte Parameter entfernen. 2. Um den Wert eines vorhandenen Parameters zu überschreiben. Unter diesem Gesichtspunkt indexOfkönnte die Verwendung von nun zu unnötiger Komplexität des Codes führen.
Yeyo
3
location.href = location.href + "&parameter=" + value;
Paul Alexander
quelle
2
Parameter werden dupliziert
Arun Prasad ES
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;
}

Mehr kompatible Version

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

Bitte überprüfen Sie den folgenden Code:

/*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;
Aftab
quelle
1

Eine kleine Fehlerbehebung für @ yeyos nachdenkliche Antwort oben.

Veränderung:

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

Zu:

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

Gabrien
quelle
Bitte posten Sie solche Korrekturen in einem Kommentar oder schlagen Sie sie vor und bearbeiten Sie sie. Sie rechtfertigen keine gesonderte Antwort.
JJ für Transparenz und Monica
1

Versuche dies

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

Ebenfalls:

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

Nur ein Liner von Shlomi kann in Lesezeichen verwendet werden

estani
quelle