¿Cómo redirecciono a otra página web?

¿Cómo puedo redirigir al usuario de una página a otra usando jQuery o JavaScript puro?

preguntado el 02 de febrero de 09 a las 10:02

30 Respuestas

Uno no simplemente redirige usando jQuery

jQuery no es necesario y window.location.replace(...) simulará mejor una redirección HTTP.

window.location.replace(...) es mejor que usar window.location.href, porque replace() no mantiene la página de origen en el historial de la sesión, lo que significa que el usuario no se quedará atrapado en un fiasco interminable de botón de retroceso.

Si desea simular que alguien hace clic en un enlace, utilice location.href

Si desea simular una redirección HTTP, use location.replace

Por ejemplo:

// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");

// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";

Respondido el 17 de junio de 20 a las 23:06

Nota: comportamiento similar al redireccionamiento HTTP para replace() significa que no creará una entrada en el historial de su navegador. - png

Creé esto hace 5 años después de ver tu respuesta. imgflip.com/i/11ua9c - Luke T O'Brien

ADVERTENCIA: Esta respuesta se ha proporcionado simplemente como una posible solución; Es obviamente no la mejor solución, ya que requiere jQuery. En su lugar, prefiera la solución de JavaScript pura.

$(location).attr('href', 'http://stackoverflow.com')

contestado el 19 de mayo de 19 a las 14:05

Forma estándar de JavaScript "básica" para redirigir una página

window.location.href = 'newPage.html';

O más simplemente: (desde window es global)

location.href = 'newPage.html';

Si estas aqui porque estas no logras HTTP_REFERER al redireccionar, sigue leyendo:

(De lo contrario, ignore esta última parte)


La siguiente sección es para aquellos que usan HTTP_REFERER como una de las muchas medidas de seguridad (aunque no es una gran medida de protección). Si estas usando Internet Explorer 8 o inferior, estas variables se pierden cuando se utiliza cualquier forma de redireccionamiento de páginas de JavaScript (location.href, etc.).

A continuación vamos a implementar una alternativa para IE8 y menor para que no perdamos HTTP_REFERER. De lo contrario, casi siempre puede simplemente usar window.location.href.

Prueba contra HTTP_REFERER (Pegar URL, sesión, etc.) pueden ayudar a saber si una solicitud es legítima. (Nota: también hay formas de solucionar / falsificar estas referencias, como se indica en el enlace de droop en los comentarios)


Solución simple de prueba entre navegadores (alternativa a window.location.href para Internet Explorer 9+ y todos los demás navegadores)

Uso: redirect('anotherpage.aspx');

function redirect (url) {
    var ua        = navigator.userAgent.toLowerCase(),
        isIE      = ua.indexOf('msie') !== -1,
        version   = parseInt(ua.substr(4, 2), 10);

    // Internet Explorer 8 and lower
    if (isIE && version < 9) {
        var link = document.createElement('a');
        link.href = url;
        document.body.appendChild(link);
        link.click();
    }

    // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
    else { 
        window.location.href = url; 
    }
}

Respondido el 20 de junio de 20 a las 10:06

Hay muchas formas de hacer esto.

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')

Respondido el 16 de enero de 19 a las 10:01

Esto funciona para todos los navegadores:

window.location.href = 'your_url';

Respondido el 04 de diciembre de 14 a las 20:12

Sería útil que fuera un poco más descriptivo en lo que está tratando de hacer. Si está intentando generar datos paginados, existen algunas opciones para hacerlo. Puede generar enlaces separados para cada página a la que desea poder acceder directamente.

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

Tenga en cuenta que la página actual en el ejemplo se maneja de manera diferente en el código y con CSS.

Si desea que los datos paginados se cambien a través de AJAX, aquí es donde entraría jQuery. Lo que haría es agregar un controlador de clic a cada una de las etiquetas de anclaje correspondientes a una página diferente. Este controlador de clic invocaría un código jQuery que busca la página siguiente a través de AJAX y actualiza la tabla con los nuevos datos. El siguiente ejemplo asume que tiene un servicio web que devuelve los datos de la nueva página.

$(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
    });
});

Respondido 02 Feb 09, 13:02

Tambien pienso que location.replace(URL) es la mejor manera, pero si desea notificar a los motores de búsqueda sobre su redirección (no analizan el código JavaScript para ver la redirección), debe agregar el rel="canonical" metaetiqueta a su sitio web.

Agregar una sección noscript con una metaetiqueta de actualización HTML en ella también es una buena solución. Te sugiero que uses esto Herramienta de redirección de JavaScript para crear redirecciones. También tiene soporte para Internet Explorer para pasar la referencia HTTP.

El código de muestra sin demora se ve así:

<!-- 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 -->

Respondido el 18 de enero de 18 a las 15:01

Pero si alguien quiere redirigir a la página de inicio, puede usar el siguiente fragmento.

window.location = window.location.host

Sería útil si tiene tres entornos diferentes como desarrollo, preparación y producción.

Puede explorar este objeto window o window.location simplemente poniendo estas palabras en Chrome Console o FirebugConsola.

Respondido el 21 de enero de 17 a las 20:01

JavaScript le proporciona muchos métodos para recuperar y cambiar la URL actual que se muestra en la barra de direcciones del navegador. Todos estos métodos utilizan el objeto Location, que es una propiedad del objeto Window. Puede crear un nuevo objeto de ubicación que tenga la URL actual de la siguiente manera ...

var currentLocation = window.location;

Estructura básica de una URL

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

enter image description here

  1. Protocolo: especifica el nombre del protocolo que se utilizará para acceder al recurso en Internet. (HTTP (sin SSL) o HTTPS (con SSL))

  2. nombre de host: el nombre de host especifica el host que posee el recurso. Por ejemplo, www.stackoverflow.com. Un servidor proporciona servicios utilizando el nombre del host.

  3. puerto: un número de puerto que se utiliza para reconocer un proceso específico al que se debe reenviar un mensaje de Internet u otro mensaje de red cuando llega a un servidor.

  4. nombre de ruta: la ruta proporciona información sobre el recurso específico dentro del host al que el cliente web desea acceder. Por ejemplo, stackoverflow.com/index.html.

  5. consulta: una cadena de consulta sigue el componente de ruta y proporciona una cadena de información que el recurso puede utilizar para algún propósito (por ejemplo, como parámetros para una búsqueda o como datos para procesar).

  6. hash: la parte de anclaje de una URL, incluye el signo de almohadilla (#).

Con estas propiedades del objeto de ubicación, puede acceder a todos estos componentes de URL

  1. hachís -Configura o devuelve la parte de anclaje de una URL.
  2. fortaleza -Configura o devuelve el nombre de host y el puerto de una URL.
  3. hostname -Configura o devuelve el nombre de host de una URL.
  4. href -Configura o devuelve la URL completa.
  5. ruta -Configura o devuelve el nombre de la ruta de una URL.
  6. Puerto -Configura o devuelve el número de puerto que utiliza el servidor para una URL.
  7. protocolo -Configura o devuelve el protocolo de una URL.
  8. buscar -Configura o devuelve la parte de consulta de una URL

Ahora, si desea cambiar una página o redirigir al usuario a otra página, puede usar el href propiedad del objeto Location como este

Puede utilizar la propiedad href del objeto Location.

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

Objeto de ubicación también tengo estos tres métodos

  1. asignar() - Carga un nuevo documento.
  2. recargar() - Vuelve a cargar el documento actual.
  3. reemplazar() - Reemplaza el documento actual por uno nuevo

Puede usar los métodos asignar () y reemplazar también para redirigir a otras páginas como estas

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

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

En qué difiere asignar () y reemplazar () - La diferencia entre el método replace () y el método assign () (), es que replace () elimina la URL del documento actual del historial del documento, lo que significa que no es posible usar el botón "atrás" para navegar de regreso a el documento original. Por lo tanto, use el método assign () si desea cargar un nuevo documento y desea dar la opción de navegar de regreso al documento original.

Puede cambiar la propiedad href del objeto de ubicación usando jQuery también me gusta esto

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

Y, por lo tanto, puede redirigir al usuario a otra URL.

Respondido 24 Oct 17, 10:10

Básicamente jQuery es solo un JavaScript framework y para hacer algunas de las cosas como redirección en este caso, puede usar JavaScript puro, por lo que en ese caso tiene 3 opciones usando JavaScript vanilla:

1) Uso de la ubicación reemplazar, esto reemplazará el historial actual de la página, significa que no es posible usar el Atrás para volver a la página original.

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

2) Uso de la ubicación asignar, esto mantendrá el historial para usted y con el botón de retroceso, puede volver a la página original:

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

3) Recomiendo usar una de esas formas anteriores, pero esta podría ser la tercera opción usando JavaScript puro:

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

También puede escribir una función en jQuery para manejarlo, pero no se recomienda ya que solo es una función de JavaScript pura de una línea, también puede usar todas las funciones anteriores sin ventana si ya está en el alcance de la ventana, por ejemplo window.location.replace("http://stackoverflow.com"); podría ser location.replace("http://stackoverflow.com");

También los muestro todos en la imagen de abajo:

ubicación.reemplazar ubicación.asignar

Respondido el 18 de enero de 19 a las 23:01

Debería poder configurar usando window.location.

Ejemplo:

window.location = "https://stackoverflow.com/";

Aquí hay una publicación anterior sobre el tema: ¿Cómo redirecciono a otra página web?

contestado el 19 de mayo de 19 a las 14:05

Antes de comenzar, jQuery es una biblioteca de JavaScript utilizada para la manipulación de DOM. Por lo tanto, no debería usar jQuery para una redirección de página.

Una cita de Jquery.com:

Si bien jQuery puede ejecutarse sin problemas importantes en versiones anteriores del navegador, no probamos activamente jQuery en ellos y, por lo general, no corregimos los errores que pueden aparecer en ellos.

Fue encontrado aquí: https://jquery.com/browser-support/

Por lo tanto, jQuery no es una solución definitiva para la compatibilidad con versiones anteriores.

La siguiente solución que utiliza JavaScript sin formato funciona en todos los navegadores y ha sido estándar durante mucho tiempo, por lo que no necesita ninguna biblioteca para la compatibilidad con varios navegadores.

Esta página redirigirá a Google después de 3000 milisegundos

<!DOCTYPE html>
<html>
    <head>
        <title>example</title>
    </head>
    <body>
        <p>You will be redirected to google shortly.</p>
        <script>
            setTimeout(function(){
                window.location.href="http://www.google.com"; // The URL that will be redirected too.
            }, 3000); // The bigger the number the longer the delay.
        </script>
    </body>
</html>

Las diferentes opciones son las siguientes:

window.location.href="url"; // Simulates normal navigation to a new page
window.location.replace("url"); // Removes current URL from history and replaces it with a new URL
window.location.assign("url"); // Adds new URL to the history stack and redirects to the new URL

window.history.back(); // Simulates a back button click
window.history.go(-1); // Simulates a back button click
window.history.back(-1); // Simulates a back button click
window.navigate("page.html"); // Same as window.location="url"

Al usar reemplazar, el botón de retroceso no volverá a la página de redireccionamiento, como si nunca hubiera estado en el historial. Si desea que el usuario pueda volver a la página de redireccionamiento, utilice window.location.href or window.location.assign. Si usa una opción que le permite al usuario volver a la página de redireccionamiento, recuerde que cuando ingrese a la página de redireccionamiento, lo redireccionará nuevamente. Así que tenlo en cuenta al elegir una opción para tu redireccionamiento. En condiciones en las que la página solo se redirige cuando el usuario realiza una acción, entonces estará bien tener la página en el historial del botón Atrás. Pero si la página se redirecciona automáticamente, entonces debe usar reemplazar para que el usuario pueda usar el botón Atrás sin verse obligado a regresar a la página que envía la redirección.

También puede utilizar metadatos para ejecutar una redirección de página como se indica a continuación.

Actualizar META

<meta http-equiv="refresh" content="0;url=http://evil.com/" />

Ubicación META

<meta http-equiv="location" content="URL=http://evil.com" />

Secuestro de BASE

<base href="http://evil.com/" />

En esta página se pueden encontrar muchos más métodos para redirigir a su cliente desprevenido a una página a la que quizás no deseen ir (ninguno de ellos depende de jQuery):

https://code.google.com/p/html5security/wiki/RedirectionMethods

También me gustaría señalar que a las personas no les gusta que las redireccionen al azar. Solo redirija a las personas cuando sea absolutamente necesario. Si comienza a redirigir a las personas al azar, nunca volverán a visitar su sitio.

El siguiente párrafo es hipotético:

También puede ser reportado como un sitio malicioso. Si eso sucede, cuando las personas hacen clic en un enlace a su sitio, el navegador del usuario puede advertirles que su sitio es malicioso. Lo que también puede suceder es que los motores de búsqueda comiencen a bajar su calificación si las personas informan una mala experiencia en su sitio.

Consulte las Directrices para webmasters de Google sobre redireccionamientos: https://support.google.com/webmasters/answer/2721217?hl=en&ref_topic=6001971

Aquí hay una pequeña página divertida que lo saca de la página.

<!DOCTYPE html>
<html>
    <head>
        <title>Go Away</title>
    </head>
    <body>
        <h1>Go Away</h1>
        <script>
            setTimeout(function(){
                window.history.back();
            }, 3000);
        </script>
    </body>
</html>

Si combina los ejemplos de dos páginas, tendrá un ciclo infantil de redireccionamiento que garantizará que su usuario nunca más querrá usar su sitio.

contestado el 19 de mayo de 19 a las 14:05

var url = 'asdf.html';
window.location.href = url;

contestado el 01 de mayo de 12 a las 21:05

Puedes hacer eso sin jQuery como:

window.location = "http://yourdomain.com";

Y si solo quieres jQuery, puedes hacerlo así:

$jq(window).attr("location","http://yourdomain.com");

respondido 29 nov., 14:06

Esto funciona con jQuery:

$(window).attr("location", "http://google.fr");

Respondido 30 Oct 16, 16:10

# Redireccionamiento de páginas HTML mediante el método jQuery / JavaScript

Prueba este código de ejemplo:

function YourJavaScriptFunction()
{
    var i = $('#login').val();
    if (i == 'login')
        window.location = "Login.php";
    else
        window.location = "Logout.php";
}

Si desea dar una URL completa como window.location = "www.google.co.in";.

Respondido 20 ago 20, 05:08

Pregunta original "¿Cómo redirigir usando jQuery?", De ahí que la respuesta implemente jQuery >> Caso de uso complementario.


Para simplemente redirigir a una página con JavaScript:

window.location.href = "/contact/";

O si necesita un retraso:

setTimeout(function () {
  window.location.href = "/contact/";
}, 2000);   // Time in milliseconds

jQuery le permite seleccionar elementos de una página web con facilidad. Puede encontrar lo que desee en una página y luego usar jQuery para agregar efectos especiales, reaccionar a las acciones del usuario o mostrar y ocultar contenido dentro o fuera del elemento que ha seleccionado. Todas estas tareas comienzan con saber cómo seleccionar un elemento o un evento.

$('a,img').on('click',function(e){
  e.preventDefault();
  $(this).animate({
    opacity: 0 //Put some CSS animation here
  }, 500);
  setTimeout(function(){
    // OK, finished jQuery staff, let's go redirect
    window.location.href = "/contact/";
  },500);
});

Imagínese que alguien escribió un script / complemento con 10000 líneas de código. Con jQuery puede conectarse a este código con solo una línea o dos.

Respondido el 24 de Septiembre de 19 a las 17:09

Necesitas poner esta línea en tu código:

$(location).attr("href","http://stackoverflow.com");

Si no tiene jQuery, vaya con JavaScript:

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

respondido 28 mar '19, 05:03

Entonces, la pregunta es cómo hacer una página de redireccionamiento y no cómo redirigir a un sitio web.

Solo necesita usar JavaScript para esto. Aquí hay un pequeño código que creará una página de redireccionamiento dinámico.

<script>
    var url = window.location.search.split('url=')[1]; // Get the URL after ?url=
    if( url ) window.location.replace(url);
</script>

Supongamos que acaba de poner este fragmento en un redirect/index.html archivo en su sitio web, puede usarlo así.

http://www.mywebsite.com/redirect?url=http://stackoverflow.com

Y si va a ese enlace, lo redirigirá automáticamente a stackoverflow.com.

Enlace a la documentación

Y así es como haces un Sencillo redirigir página con JavaScript

Edit:

También hay una cosa a tener en cuenta. Yo he añadido window.location.replace en mi código porque creo que se adapta a una página de redireccionamiento, pero debes saber que al usar window.location.replace y te redirigen, cuando presionas el botón Atrás en tu navegador, no volvió a la página de redireccionamiento, y volverá a la página anterior, eche un vistazo a esta pequeña demostración.

Ejemplo:

El proceso: tienda del hogar => redirigir la página a google => google

Cuando en google: google => botón de retroceso en el navegador => tienda del hogar

Entonces, si esto se adapta a sus necesidades, entonces todo debería estar bien. Si desea incluir la página de redireccionamiento en el historial del navegador, reemplace este

if( url ) window.location.replace(url);

con

if( url ) window.location.href = url;

Respondido el 20 de junio de 20 a las 10:06

En su función de clic, simplemente agregue:

window.location.href = "The URL where you want to redirect";
$('#id').click(function(){
    window.location.href = "http://www.google.com";
});

Respondido 26 Oct 14, 10:10

Prueba esto:

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

Fragmento de código de ejemplo.

Respondido el 02 de enero de 16 a las 04:01

jQuery no es necesario. Puedes hacerlo:

window.open("URL","_self","","")

¡Es así de fácil!

La mejor forma de iniciar una solicitud HTTP es con document.loacation.href.replace('URL').

Respondido 03 Abr '14, 22:04

Primero escribe correctamente. Desea navegar dentro de una aplicación para buscar otro enlace desde su aplicación para otro enlace. Aquí está el código:

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

Y si desea navegar por las páginas dentro de su aplicación, también tengo código, si lo desea.

Respondido 03 Abr '14, 22:04

Puede redirigir en jQuery así:

$(location).attr('href', 'http://yourPage.com/');

Respondido 03 Jul 16, 06:07

Usando JavaScript:

Método 1:

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

Método 2:

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

Usando jQuery:

Método 1: $ (ubicación)

$(location).attr('href', 'http://google.com');

Método 2: función reutilizable

jQuery.fn.redirectTo = function(url){
    window.location.href = url;
}

jQuery(window).redirectTo("http://google.com");

Respondido el 25 de Septiembre de 19 a las 18:09

En JavaScript y jQuery podemos usar el siguiente código para redirigir una página a otra página:

window.location.href="http://google.com";
window.location.replace("page1.html");

Respondido 03 Abr '14, 22:04

ECMAScript 6 + jQuery, 85 bytes

$({jQueryCode:(url)=>location.replace(url)}).attr("jQueryCode")("http://example.com")

Por favor, no me mates, esto es una broma. Es una broma. Esto es una broma.

Esto "proporcionó una respuesta a la pregunta", en el sentido de que pidió una solución "usando jQuery" que en este caso implica forzarlo en la ecuación de alguna manera.

Ferrybig aparentemente necesita que le expliquen la broma (aún bromeando, estoy seguro de que hay opciones limitadas en el formulario de revisión), así que sin más preámbulos:

Otras respuestas están usando jQuery's attr() en location or window objetos innecesariamente.

Esta respuesta también abusa de ella, pero de una forma más ridícula. En lugar de usarlo para establecer la ubicación, esto usa attr() para recuperar una función que establece la ubicación.

La función se llama jQueryCode aunque no hay nada de jQuery al respecto, y llamar a una función somethingCode es simplemente horrible, especialmente cuando el algo ni siquiera es un idioma.

Los "85 bytes" son una referencia a Code Golf. El golf, obviamente, no es algo que deba hacer fuera del código de golf y, además, esta respuesta claramente no es realmente golf.

Básicamente, encogerse.

Respondido 30 Oct 16, 16:10

JavaScript:

window.location.href='www.your_url.com';
window.top.location.href='www.your_url.com';
window.location.replace('www.your_url.com');

jquery:

var url='www.your_url.com';
$(location).attr('href',url);
$(location).prop('href',url);//instead of location you can use window

contestado el 04 de mayo de 17 a las 13:05

Aquí hay una redirección de retardo de tiempo. Puede configurar el tiempo de retraso como desee:

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Your Document Title</title>
    <script type="text/javascript">
        function delayer(delay) {
            onLoad = setTimeout('window.location.href = "http://www.google.com/"', delay);
        }
    </script>
</head>

<body>
    <script>
        delayer(8000)
    </script>
    <div>You will be redirected in 8 seconds!</div>
</body>

</html>

Respondido 23 Feb 16, 06:02

Hay tres formas principales de hacer esto,

window.location.href='blaah.com';
window.location.assign('blaah.com');

y ...

window.location.replace('blaah.com');

El último es el mejor, para un redireccionamiento tradicional, porque no guardará la página a la que fue antes de ser redirigido en su historial de búsqueda. Sin embargo, si solo desea abrir una pestaña con JavaScript, puede usar cualquiera de los anteriores.1

EDITAR: El window el prefijo es opcional.

Respondido el 20 de junio de 20 a las 10:06

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.