Cambiar URL y redirigir usando jQuery

132

Tengo un código como este,

<form id="abc">
  <input type="text" id="txt" />
</form>

y ahora quiero redirigir así,

var temp = $("#txt").val();
url = "http://example.com/" + temp;
window.location.replace(url);
// or window.location(url);

¿Hay alguna forma en jQuery para resolver esto? Todavía me deja tener url = http://example.com.

gacon
fuente
Muchas gracias a todos! Ahora todavía no sé qué diferencia entre window.location y window.location.replace. En mi ejemplo, solo necesito publicar una URL en mi página así: abc.com/abc para que abc busque en mi base de datos con abc es lo que el usuario escribe en poner y presionar enter o botón, pero siempre devuelve abc.com ? name = abc, así que creo que puedo activar en el evento de envío para redirigir y cambiar mi URL a lo que quiero, pero todavía no hacen nada. Eso es todo, por cierto, gracias de nuevo!
gacon
3
Le expliqué la diferencia entre window.location y window.location.replace aquí: stackoverflow.com/questions/846954/…
Mathias Bynens

Respuestas:

343

Como se menciona en las otras respuestas, no necesita jQuery para hacer esto; solo puede usar las propiedades estándar.

Sin embargo, parece que no parece saber la diferencia entre window.location.replace(url)y window.location = url.

  1. window.location.replace(url)reemplaza la ubicación actual en la barra de direcciones por una nueva. La página que llamaba a la función no se incluirá en el historial del navegador. Por lo tanto, en la nueva ubicación, al hacer clic en el botón Atrás de su navegador, volverá a la página que estaba viendo antes de visitar el documento que contiene el JavaScript de redireccionamiento.
  2. window.location = urlredirige a la nueva ubicación. En esta nueva página, el botón Atrás de su navegador apuntaría a la página original que contiene el JavaScript de redireccionamiento.

Por supuesto, ambos tienen sus casos de uso, pero me parece que en este caso deberías quedarte con el último.

PD: Probablemente olvidaste dos barras después http:de la línea 2 de tu JavaScript:

url = "http://abc.com/" + temp;
Mathias Bynens
fuente
55
Pero para ser muy correcto, debe establecer window.location.href en lugar de window.location. Si bien ambos funcionan hoy en día, este último es un objeto (y, por supuesto, no es compatible para asignar una cadena a una versión antigua de IE ...)
Victor
1
@Victor [cita requerida]
Mathias Bynens
1
@Victor Eso no enumera ninguna versión antigua de IE donde esto interrumpa. El comentario de @bobince es correcto: stackoverflow.com/a/10016109/96656#comment18225061_10016109
Mathias Bynens
Menos 1. No es suficiente jQuery
VarunAgw
41

Te digo la verdad, todavía no consigo lo que necesitas, pero

window.location(url);

debiera ser

window.location = url;

una búsqueda en window.location referencia le dirá eso.

balexandre
fuente
18

jQuery no tiene una opción para esto, ni debería tener una. Este es un javascript perfectamente válido y no hay razón para que jQuery proporcione funciones de contenedor para esto.

jQuery es solo una biblioteca sobre javascript, incluso si usa jQuery todavía puede usar javascript normal.

Por cierto, window.location no es una función sino una propiedad que debe establecer de esta manera:

window.location = url;
Pim Jager
fuente
voto negativo para reclamar jQuery no tiene un método para esto (a pesar de que es una exageración innecesaria y no debería recomendarse) $ jq (ventana) .attr ("ubicación", " sudominio.com" ); o $ (ubicación) .attr ('href', url);
robar el
9
Upvoted para deshacer ese downvote. La respuesta de Pim puede leerse fácilmente como "no hay un método específico en jQuery para esto". Votar en contra de la semántica léxica es un mal uso de ese privilegio.
Nigel Angel
Votado porque sabe ... es correcto "no hay un método específico en jQuery para esto", ¿por qué le gustaría tener una solución tan fea como: $ jq (ventana) .attr ("ubicación", "sudominio. com "); cuando puedes tener algo como window.location = url;
Rodolfo Abarca
11
var temp="/yourapp/";
$(location).attr('href','http://abcd.com'+temp);

Prueba esto ... usado como una alternativa


fuente
3

Prueba esto...

$("#abc").attr("action", "/yourapp/" + temp).submit();

Lo que significa:

Busque un formulario con id"abc", cambie su attributenombre como "acción" y luego envíelo ...

Esto funciona para mí ... !!!

amouat
fuente
1
jajaja, eso es un poco divertido S! Sin embargo, me gusta la idea. ¡Puntos por ser creativo!
Eric Bishard el
-2

puedes hacerlo más simple sin jquery

location = "https://example.com/" + txt.value

Kamil Kiełczewski
fuente
No funciona, y no puedo ver cómo podría. La ubicación no es global. window.location es. editar: Sí verificado. No funciona, al menos no en cromo. Considere actualizar su ejemplo a window.location
Shayne
Extraño: en mi Chrome, Firefox, Safari funciona, la ubicación es una propiedad global, por ejemplo, cuando escribo en la consola de Chrome: location = 'https://google.com'luego cambia de página, ¿intentas en otros navegadores?
Kamil Kiełczewski
@Shayne cuando escribes thisy this.locationen la consola, ¿qué ves?
Kamil Kiełczewski
this.location solo funciona cuando "this" se refiere a la ventana. Lo cual rara vez será el caso. Explícito siempre es mejor que implícito, especialmente si no quieres sorprenderte cuando tu código no es portátil o reutilizable
Shayne
Sí, tiene razón, sin embargo, me pregunto: ¿por qué en su navegador thisno hace referencia al windowobjeto (y el fragmento anterior no funciona)? (en el contexto global de los navegadores, debe configurarse como objeto de Windows )
Kamil Kiełczewski