Wie kann ich auf eine andere Webseite umleiten?

Question

Wie kann ich den Benutzer mit jQuery oder reinem JavaScript von einer Seite auf eine andere umleiten?

Answer 1

Es wäre hilfreich, wenn Sie ein wenig genauer beschreiben würden, was Sie zu tun versuchen. Wenn Sie versuchen, seitenweise Daten zu generieren, gibt es einige Optionen, wie Sie dies tun können. Sie können für jede Seite, die Sie direkt ansteuern möchten, einen eigenen Link erstellen.

<a href='http://stackoverflow.com/path-to-page?page=1' class='pager-link'>1</a>
<a href='http://stackoverflow.com/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

Beachten Sie, dass die aktuelle Seite im Beispiel im Code und mit CSS unterschiedlich behandelt wird.

Wenn Sie möchten, dass die Daten auf der Seite über AJAX geändert werden, kommt jQuery ins Spiel. Was Sie tun würden, ist ein Klick-Handler zu jedem der Anker-Tags entsprechend einer anderen Seite hinzufügen. Dieser Click-Handler würde einen jQuery-Code aufrufen, der über AJAX die nächste Seite abruft und die Tabelle mit den neuen Daten aktualisiert. Im folgenden Beispiel wird davon ausgegangen, dass Sie einen Webdienst haben, der die Daten der neuen Seite zurückgibt.

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});

Answer 2

Ich denke auch, dass location.replace(URL) ist der beste Weg, aber wenn Sie die Suchmaschinen über Ihre Umleitung informieren wollen (sie analysieren den JavaScript-Code nicht, um die Umleitung zu sehen), sollten Sie die rel="canonical" Meta-Tag auf Ihrer Website.

Das Hinzufügen eines Noscript-Abschnitts mit einem HTML-Refresh-Meta-Tag ist ebenfalls eine gute Lösung. Ich schlage vor, dass Sie Folgendes verwenden JavaScript-Umleitungstool um Umleitungen zu erstellen. Außerdem unterstützt es den Internet Explorer, um den HTTP-Referrer zu übergeben.

Der Beispielcode ohne Verzögerung sieht wie folgt aus:

<!-- Place this snippet right after opening the head tag to make it work properly -->

<!-- This code is licensed under GNU GPL v3 -->
<!-- You are allowed to freely copy, distribute and use this code, but removing author credit is strictly prohibited -->
<!-- Generated by http://insider.zone/tools/client-side-url-redirect-generator/ -->

<!-- REDIRECTING STARTS -->
<link rel="canonical" href="https://yourdomain.com/"/>
<noscript>
    <meta http-equiv="refresh" content="0;URL=https://yourdomain.com/">
</noscript>
<!--[if lt IE 9]><script type="text/javascript">var IE_fix=true;</script><![endif]-->
<script type="text/javascript">
    var url = "https://yourdomain.com/";
    if(typeof IE_fix != "undefined") // IE8 and lower fix to pass the http referer
    {
        document.write("redirecting..."); // Don't remove this line or appendChild() will fail because it is called before document.onload to make the redirect as fast as possible. Nobody will see this text, it is only a tech fix.
        var referLink = document.createElement("a");
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    }
    else { window.location.replace(url); } // All other browsers
</script>
<!-- Credit goes to http://insider.zone/ -->
<!-- REDIRECTING ENDS -->

Answer 3

Aber wenn jemand zurück zur Startseite umleiten will, kann er das folgende Snippet verwenden.

window.location = window.location.host

Es wäre hilfreich, wenn Sie drei verschiedene Umgebungen haben, nämlich Entwicklungs-, Staging- und Produktionsumgebung.

Sie können dieses Fenster oder window.location-Objekt untersuchen, indem Sie einfach diese Wörter in die Chrome-Konsole eingeben oder Firebug der Konsole.

Answer 4

JavaScript bietet Ihnen viele Methoden zum Abrufen und Ändern der aktuellen URL, die in der Adressleiste des Browsers angezeigt wird. Alle diese Methoden verwenden das Location-Objekt, das eine Eigenschaft des Window-Objekts ist. Sie können ein neues Location-Objekt erstellen, das die aktuelle URL wie folgt enthält.

var currentLocation = window.location;

Grundlegende Struktur einer URL

<protocol>//<hostname>:<port>/<pathname><search><hash>

1. Protokoll -- Gibt den Protokollnamen an, der für den Zugriff auf die Ressource im Internet verwendet werden soll. (HTTP (ohne SSL) oder HTTPS (mit SSL))

2. hostname -- Der Hostname gibt den Host an, dem die Ressource gehört. Zum Beispiel: www.stackoverflow.com. Ein Server bietet Dienste an, die den Namen des Hosts verwenden.

3. port -- Eine Portnummer, die dazu dient, einen bestimmten Prozess zu erkennen, an den eine Internet- oder andere Netzwerknachricht weitergeleitet werden soll, wenn sie auf einem Server ankommt.

4. pathname -- Der Pfad gibt Auskunft über die spezifische Ressource innerhalb des Hosts, auf die der Web-Client zugreifen möchte. Zum Beispiel: stackoverflow.com/index.html.

5. query -- Eine Abfragezeichenfolge folgt auf die Pfadkomponente und enthält eine Zeichenfolge von Informationen, die die Ressource für einen bestimmten Zweck verwenden kann (z. B. als Parameter für eine Suche oder als zu verarbeitende Daten).

6. hash -- Der Ankerteil einer URL, enthält das Rautenzeichen (#).

Mit diesen Eigenschaften des Location-Objekts können Sie auf alle diese URL-Komponenten zugreifen

1. Hash -Setzt oder gibt den Ankerteil einer URL zurück.
2. Gastgeber -Setzt oder gibt den Hostnamen und den Port einer URL zurück.
3. Hostname -Sätze oder gibt den Hostnamen einer URL zurück.
4. href -Setzt oder gibt die gesamte URL.
5. Pfadname -Setzt oder gibt den Pfadnamen einer URL zurück.
6. Hafen -Legt die Portnummer fest oder gibt sie zurück, die der Server für eine URL verwendet.
7. Protokoll -Setzt oder liefert das Protokoll einer URL.
8. Suche -Setzt oder gibt den Abfrageteil einer URL zurück

Wenn Sie nun eine Seite ändern oder den Benutzer auf eine andere Seite umleiten möchten, können Sie die href Eigenschaft des Location-Objekts wie folgt

Sie können die href-Eigenschaft des Location-Objekts verwenden.

window.location.href = "http://www.stackoverflow.com";

Standort Objekt haben auch diese drei Methoden

1. zuweisen() -- Lädt ein neues Dokument.
2. neu laden() -- Lädt das aktuelle Dokument erneut.
3. ersetzen() -- Ersetzt das aktuelle Dokument durch ein neues Dokument

Sie können die Methoden assign() und replace auch verwenden, um auf andere Seiten umzuleiten, z. B.

location.assign("http://www.stackoverflow.com");

location.replace("http://www.stackoverflow.com");

Wie sich assign() und replace() unterscheiden -- Der Unterschied zwischen der replace()-Methode und der assign()-Methode besteht darin, dass replace() die URL des aktuellen Dokuments aus der Dokumentenhistorie entfernt, d.h. es ist nicht möglich, über die Schaltfläche "Zurück" zum ursprünglichen Dokument zu navigieren. Verwenden Sie also die assign()-Methode, wenn Sie ein neues Dokument laden und die Möglichkeit haben wollen, zum ursprünglichen Dokument zurück zu navigieren.

Sie können die href-Eigenschaft des Standortobjekts ändern, indem Sie jQuery Auch das gefällt mir

$(location).attr('href',url);

So können Sie den Benutzer auf eine andere URL umleiten.

Answer 5

Grundsätzlich jQuery ist nur eine JavaScript Rahmen und für die Durchführung einiger Dinge wie Nachsendung in diesem Fall können Sie einfach reines JavaScript verwenden, so dass Sie in diesem Fall 3 Optionen mit Vanilla JavaScript haben:

1) Verwendung des Standorts ersetzen. wird der aktuelle Verlauf der Seite ersetzt, was bedeutet, dass es nicht möglich ist, die zurück um zur ursprünglichen Seite zurückzukehren.

window.location.replace("http://stackoverflow.com");

2) Standort nutzen zuweisen. Damit wird der Verlauf für Sie gespeichert, und mit der Schaltfläche Zurück können Sie zur ursprünglichen Seite zurückkehren:

window.location.assign("http://stackoverflow.com");

3) Ich empfehle die Verwendung einer der vorgenannten Möglichkeiten, aber dies könnte die dritte Option sein, die reines JavaScript verwendet:

window.location.href="http://stackoverflow.com";

Sie können auch eine Funktion in jQuery schreiben, um es zu handhaben, aber nicht empfohlen, da es nur eine Zeile reine JavaScript-Funktion ist, auch können Sie alle oben genannten Funktionen ohne Fenster verwenden, wenn Sie bereits im Fensterbereich sind, zum Beispiel window.location.replace("http://stackoverflow.com"); sein könnte location.replace("http://stackoverflow.com");

Ich zeige sie auch alle auf dem Bild unten: