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

¿Cómo redirigir a un usuario de una página a otra usando jQuery o javascript puro?

7735
02 февр. conjunto por venkatachalam 02 feb 2009-02-02 15:54 '09 a las 15:54 2009-02-02 15:54
@ 80 respuestas
  • 1
  • 2
  • 3

Uno no solo redirecciona usando jQuery

jQuery no es obligatorio, y window.location.replace(...) mejor redirección de HTTP simulada.

window.location.replace(...) mejor que usar window.location.href , porque replace() no guarda la página original en el historial de la sesión, es decir, el usuario no está atrapado en el fiasco sin fin del botón Atrás.

Si desea imitar a alguien haciendo clic en el enlace, use location.href

Si desea simular la redirección de 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"; 
13553
03 февр. La respuesta la da Ryan McGeary 03 de febrero. 2009-02-03 07:24 '09 a las 7:24 am 2009-02-03 07:24

ADVERTENCIA: Esta respuesta fue simplemente proporcionada como una posible solución; Obviamente, esta no es la mejor solución, ya que se requiere jQuery para esto. En su lugar, prefiere una solución javascript limpia.

border=0
1540
28 окт. respuesta dada por Boris Guéry 28 de octubre 2009-10-28 19:35 '09 a las 19:35 2009-10-28 19:35

Método de redireccionamiento de página de javascript "vainilla" estándar:

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


Si está aquí porque pierde HTTP_REFERER al redirigir, siga leyendo:


La siguiente sección está dirigida a aquellos que usan HTTP_REFERER como una de las muchas medidas seguras (aunque esto no es una gran medida de protección). Si usa Internet Explorer 8 o una versión inferior, estas variables se pierden cuando se utiliza cualquier forma de redireccionar la página de JavaScript (location.href, etc.).

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

Las pruebas sobre HTTP_REFERER (inserción de URL, sesión, etc.) pueden ser útiles para determinar si una solicitud es legítima. ( Nota: también hay formas de omitir / engañar a estos referentes, como se señala en la descripción de los enlaces con un error)


Una solución simple para las pruebas entre navegadores (revertir 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; } } 
556
27 июля '12 в 17:41 2012-07-27 17:41 La respuesta la ofrece Mark Pieszak - DevHelp.Online 27 de julio de 2012 a las 17:41 2012-07-27 17:41

Hay muchas maneras 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') 
369
28 янв. Govind Singh respondió 28 de enero 2014-01-28 07:28 '14 a las 7:28 2014-01-28 07:28

Funciona para todos los navegadores:

 window.location.href = 'your_url'; 
292
23 окт. respuesta dada a Fred el 23 de octubre 2010-10-23 02:45 '10 a las 2:45 am 2010-10-23 02:45

Te ayudaría si fueras un poco más visual sobre lo que estás tratando de hacer. Si está intentando generar datos paginados, hay algunas opciones sobre cómo hacerlo. Puede crear enlaces separados para cada página con la que desea enlazar 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> ... 

Observe 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 de la página se modifiquen utilizando AJAX, jQuery estará involucrado aquí. Lo que haría es agregar un controlador de clic para cada una de las etiquetas de anclaje que corresponden a la otra página. Este controlador llamará a algún código jQuery que se envía y muestra la página siguiente a través de AJAX y actualiza la tabla con datos nuevos. En el siguiente ejemplo, se supone que tiene un servicio web que devuelve nuevos datos de 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 }); }); 
273
02 февр. La respuesta es dada por tvanfosson 02 feb. 2009-02-02 16:18 '09 a las 16:18 2009-02-02 16:18

También creo que location.replace(URL) es la mejor manera, pero si desea notificar a los motores de búsqueda su redirección (no analizan el código JavaScript para ver la redirección), debe agregar una etiqueta meta rel="canonical" a su sitio.

Agregar una sección de noscript con metaetiquetas de actualización HTML también es una buena solución. Le sugiero que utilice esta herramienta de redirección de javascript para crear redirecciones. También tiene soporte de Internet Explorer para enviar una 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 --> 
232
25 апр. La respuesta la da Patartics Milán el 25 de abril. 2013-04-25 13:12 '13 a las 13:12 2013-04-25 13:12

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

 window.location = window.location.host 

Sería útil si tuviera tres entornos diferentes: desarrollo, producción y producción.

Puede examinar esta ventana o el objeto window.location simplemente colocando estas palabras en la consola de Chrome o Firebug .

206
30 окт. La respuesta la da Nadeem Yasin el 30 de octubre. 2012-10-30 15:15 '12 a las 15:15 2012-10-30 15:15

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

 var currentLocation = window.location; 

Estructura de URL básica

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

2019

195
23 дек. Nikhil Agrawal respondió el 23 de diciembre. 2013-12-23 16:35 '13 a las 16:35 2013-12-23 16:35

Debería configurarse simplemente usando window.location .

Ejemplo:

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

Aquí está el artículo anterior sobre este tema:

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

182
16 февр. La respuesta se da Newse 16 Feb. 2014-02-16 17:42 '14 a las 17:42 2014-02-16 17:42

De hecho, jQuery es solo una infraestructura de JavaScript, y para lograr ciertas cosas, como la redirección en este caso, simplemente puede usar JavaScript puro, así que en este caso tiene 3 opciones para usar JavaScript de vainilla:

1) Al determinar una ubicación mediante un intercambio, esto reemplaza el historial de la página actual, lo que significa que no puede usar el botón Atrás para volver a la página original.

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

2) Usando la ubicación de destino , guardará el historial por usted, y usando el botón Atrás puede regresar a la página original:

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

3) Recomiendo usar uno de estos métodos anteriores, pero 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 procesarla, pero esto no se recomienda porque es solo una línea de la función JavaScript, también puede usar todas las funciones enumeradas anteriormente sin una ventana si ya está en el ámbito de la ventana, por ejemplo window.location.replace("http://stackoverflow.com"); puede ser location.replace("http://stackoverflow.com");

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

2019

26 февр. Responder Alireza 26 feb. 2017-02-26 16:36 '17 a las 4:36 pm 2017-02-26 16:36

Antes de comenzar, jQuery es una biblioteca de JavaScript utilizada para manipular el DOM. Por lo tanto, no debe usar jQuery para redirigir la página.

Cita de jquery.com:

Aunque jQuery puede funcionar sin problemas graves en versiones anteriores del navegador, no probamos activamente jQuery en ellas y, por lo general, no solucionamos los errores que pueden aparecer en ellas.

Se encontró aquí: https://jquery.com/browser-support/

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

La siguiente solución, que utiliza JavaScript en bruto, funciona en todos los navegadores y es estándar durante mucho tiempo, por lo que no necesita bibliotecas para admitir varios navegadores.

Esta página será redirigida 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 siguientes opciones son posibles:

 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 reemplazar, el botón Atrás no regresará a la página de redireccionamiento, como si nunca hubiera estado en el historial. Si desea que el usuario regrese a la página de redireccionamiento, use window.location.href o window.location.assign . Si usa la opción que le permite al usuario regresar a la página de redirección, recuerde que cuando ingresa a la página de redirección, se redirige a usted. Por lo tanto, tenga en cuenta esto al elegir una opción para la redirección. En las condiciones en las que la página solo se redirige cuando el usuario realiza la acción, la presencia de la página en el historial de los botones Atrás estará en orden. Pero si la página se redirige automáticamente, debe usar un reemplazo para que el usuario pueda usar el botón Atrás sin recibir un retorno forzado a la página enviada por redirección.

También puede utilizar metadatos para iniciar la redirección de la página, como se muestra a continuación.

Actualización de META

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

Ubicación de META

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

Secuestro de base

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

En esta página puede encontrar muchas otras formas de redirigir a su cliente desprevenido a una página que tal vez no quieran, pero ninguna de ellas 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 ser redirigidas al azar. Solo redirigir a las personas cuando sea absolutamente necesario. Si comienza a redirigir a las personas en un orden aleatorio, nunca volverán a ingresar a su sitio.

La siguiente parte es hipotética:

También puede recibir un mensaje como un sitio malicioso. Si esto sucede, cuando la gente haga clic en el enlace a su sitio, el navegador de los usuarios puede advertirles que su sitio es malicioso. También puede ocurrir que los motores de búsqueda comiencen a bajar de categoría si las personas informan malas experiencias en su sitio.

Consulte las directrices para webmasters de Google para la redirección: https://support.google.com/webmasters/answer/2721217?hl=en>

Aquí hay una pequeña página divertida que te 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 las dos páginas de muestra, tendrá un nuevo ciclo que garantiza que su usuario nunca volverá a querer usar su sitio.

28 авг. Respuesta dada por Patrick W. McMahon el 28 de agosto. 2014-08-28 00:50 '14 a las 0:50 2014-08-28 00:50
 var url = 'asdf.html'; window.location.href = url; 
151
13 окт. respuesta dada por user188973 el 13 de octubre 2009-10-13 12:36 '09 a las 12:36 2009-10-13 12:36

Puedes hacer esto sin jQuery como:

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

Y si solo quieres jQuery, entonces puedes hacerlo como:

 $jq(window).attr("location","http://yourdomain.com"); 
135
23 мая '12 в 16:03 2012-05-23 16:03 La respuesta se da en ScoRpion el 23 de mayo de 2012 a las 4:03 pm 2012-05-23 16:03

Esto funciona con jQuery:

 $(window).attr("location", "http://google.fr"); 
133
05 сент. La respuesta se da xloadx 05 sep. 2011-09-05 20:25 '11 a las 20:25 2011-09-05 20:25

# Reenviando una página HTML usando jQuery / JavaScript

Pruebe 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 especificar la URL completa como window.location = "www.google.co.in"; .

82
06 февр. La respuesta es dada por Sakthi Karthik 06 Feb. 2014-02-06 13:28 '14 a las 13:28 2014-02-06 13:28

¿Entonces la pregunta es cómo hacer que la página redirija, no cómo redirigir al sitio web?

Para hacer esto necesitas usar javascript. 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> 

Entonces, dígame que acaba de poner este fragmento en el archivo redirect/index.html en su sitio web, puede usarlo así.

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

Y si sigue este enlace, lo redirigirá automáticamente a stackoverflow.com .

Enlace de documentación

¿Y cómo crear una página de redirección simple con javascript?

Editar:

También hay un comentario. window.location.replace a mi código, porque creo que se ajusta a la página de redireccionamiento, pero necesita saber que al usar window.location.replace y se le redirige al hacer clic en el botón Atrás de su navegador. , ella no regresará a la página de redireccionamiento, y ella regresará a la página que está frente a ella, eche un vistazo a esta pequeña demostración.

Ejemplo:

Proceso: keep home => redirigir la página a google => google

Cuando se encuentra en google: google => botón de retroceso en el navegador => guardar inicio

Entonces, si esto se ajusta a tus necesidades, entonces todo debería estar bien. Si desea incluir la página de redirección en el historial de su navegador, reemplácela.

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

con

 if( url ) window.location.href = url; 
74
31 авг. Respuesta dada por iConnor el 31 de agosto. 2013-08-31 02:46 '13 a las 2:46 2013-08-31 02:46

Deberías poner esta línea en tu código:

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

Si no tiene jQuery, vaya a JavaScript usando:

 window.location.replace("http://stackoverflow.com"); window.location.href("http://stackoverflow.com"); 
74
27 янв. Responder Ashish Ratan 27 Ene 2014-01-27 13:11 '14 a las 13:11 2014-01-27 13:11

En su función de clic, simplemente añada:

 window.location.href = "The URL where you want to redirect"; $('#id').click(function(){ window.location.href = "http://www.google.com"; }); 
69
14 нояб. Respuesta dada por Swaprks el 14 de noviembre. 2012-11-14 05:17 '12 a las 5:17 2012-11-14 05:17

***** LA PREGUNTA ORIGINAL FUE "COMO REVISAR EL USO DE JQUERY", ENTONCES LA RESPUESTA IMPLEMENTA JQUERY >> EJERCICIO GRATIS *****

Solo redirigir a la página usando javascript:

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

O si necesitas un retraso:

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

jQuery te permite seleccionar fácilmente elementos de una página web. Puede encontrar todo lo que desea en la página y luego usar jQuery para agregar efectos especiales, responder a las acciones del usuario o mostrar y ocultar contenido dentro o fuera del elemento elegido. Todas estas tareas comienzan con saber cómo seleccionar un elemento o 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 go redirect window.location.href = "/contact/"; },500); }); 

¿Imagina que alguien escribió un script / plugin que contiene 10,000 líneas de código? Bueno, con jQuery, puede conectarse a este código con solo una o dos líneas.

66
26 дек. La respuesta se da SergeDirect 26 dec. 2014-12-26 22:08 '14 a las 22:08 2014-12-26 22:08

Intenta lo siguiente:

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

Fragmento de código de ejemplo .

57
19 нояб. Responder tilak 19 nov. 2013-11-19 07:01 '13 a las 7:01 am 2013-11-19 07:01

No se requiere jQuery. Usted puede hacer esto:

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

¡Es así de fácil!

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

53
11 июля '13 в 20:40 2013-07-11 20:40 la respuesta es dada por MayorMonty el 11 de julio, 13 a las 8:40 pm 2013-07-11 20:40

Primero escribe correctamente. Desea navegar dentro de la aplicación para 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 a través de las páginas en su aplicación, entonces también tengo un código si lo desea.

50
06 июня '13 в 15:37 2013-06-06 15:37 La respuesta la da Anup el 6 de junio de 2013 a las 15:37 2013-06-06 15:37

Puede redirigir a jQuery de la siguiente manera:

 $(location).attr('href', 'http://yourPage.com/'); 
50
05 сент. Respuesta dada a Azam Alvi 05 sep. 2014-09-05 19:36 '14 a las 19:36 2014-09-05 19:36

ECMAScript 6 + jQuery, 85 bytes

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

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

Esto "proporcionó una respuesta a la pregunta" en el sentido de que solicitó una solución "utilizando jQuery", que en este caso implica forzarla a ingresar a la ecuación.