654380491
hola@carlosdk.com
Login
[miniorange_social_login]

Login with your site account

Lost your password?

Carlos DK Carlos DK
  • Inicio
  • Kit digital
  • Universo Dk
  • Blog
  • Contacto
Back
  • Inicio
  • Kit digital
  • Universo Dk
  • Blog
  • Contacto
  • Home
  • Blog
  • Tutoriales formativos
  • Redireccionar con JQuery

Tutoriales formativos

05 Dic

Redireccionar con JQuery

  • By Carlos Dk
  • In Tutoriales formativos
  • 8 comments

Hay veces que necesitamos realizar un redireccionamiento de una página, ya sea para recargar, para hacer una llamada o otra web o para forzar una precarga. Así que os voy a mostrar como redireccionar con JQuery.

En realidad no es otra cosa que Javascript, pero como utilizamos en el ejemplo JQuery para concatenar el texto que se envía, pues ya lo ponemos así que mola mucho, de hecho esto muchos ni lo leerán y se irán directamente al código… Será que yo también lo hago y solo lo leo cuando no me funciona lo que copio y pego…

El código de ejemplo es el siguiente:

[codesyntax lang=”javascript”]

	<script>
		function redireccion(){
			var dominio = "http://webmail."+$("#dominio").val();
			window.location.href=dominio;
			}

	</script>

[/codesyntax]

Función de redirección en javascript

En este caso he creado una función llamada redireccion que concatena un valor string “http://www.webmail.” y le añado el valor de un campo de texto que no he puesto por ningún sitio en este ejemplo pero que por el código JQuery que estoy tomando, está claro que el objeto se llama “dominio”. podría ser una caja de texto tal que así:

[codesyntax lang="html4strict"]
<input id="dominio" type="text" />
[/codesyntax]

Una vez tenemos la caja y la función, faltaría llamar a la función, pero vamos al lío que al final me enrollo y no explico la función que realmente redirecciona, en el ejemplo de función de “redireccion” lo que hago realmente después de concatenar es hacer una llamada a la función window que maneja Javascript exactamente:

[codesyntax lang="html4strict"]
window.location.href=dominio;
[/codesyntax]

Window a su vez llama al método location y este a su vez recibe en el parámetro href un valor que será en el que redireccione. Cuando hacemos la llamada directamente el navegador lanzará la apertura de una nueva pestaña con la dirección pasada a href, que en nuestro caso la toma de la variable dominio que se le asignó el valor tomado de la caja de texto. Supongo que no es complicado si se lee todo, pero para que no tengáis dudas de lo que hago, os dejo un ejemplo completísimo de como redireccionar:

[codesyntax lang=”html4strict”]

<html>
<head>

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

	<script>
		function redireccion(){
			var dominio = "http://webmail."+$("#dominio").val();
			window.location.href=dominio;
			}

	</script>

</head>
<body>

	http://webmail.<input id="dominio" type="text" />
    <button onClick="redireccion();">Ver Correo</button>

</body>
</html>

[/codesyntax]

Ahora sí.. me despido 😉

Si os gustó y queréis agradecerlo de alguna manera, lo mínimo es compartir y sino os gustó comentad a ver que puedo mejorar para la próxima 😉

Salud!

Tags:htmljavascriptjquery
  • Share:
Carlos Dk

You may also like

Crear categorías y configurar menú en WordPress en 4 min.

  • marzo 3, 2019
  • by Carlos Dk
  • in Tutoriales formativos
Crear categoría y menú WordPress Es indispensable en una nueva instalación de WordPress, crear las...
Instalar tema en WordPress en 2 pasos
febrero 23, 2019
Actualizar MySQL 5.1 a 5.6 en CentOS 6.9 con Plesk como panel
octubre 20, 2018
Recorrer todos los objetos de una capa o del DOM completo con JQuery
diciembre 22, 2014

    Comments

  1. melon
    octubre 18, 2016

    existe alguna manera de concatenar varias webs para pasar de una a otra,ejemplo de web 1 a web 2 y de web 2 a web 3

    Responder
    • Carlos Dk
      octubre 24, 2016

      redirecciona en la web 1 a la web 2, luego monta que redireccione de la web 2 a la web 3 y así sucesivamente 🙂

      Responder
  2. CBGS
    febrero 27, 2019

    Esta genial, pero ¿Como le hago para que me funcione en un navegador chrome? lo implemente en uno firefox mozillay funciono a la perfeccion pero al abrir el sys. en el navegador chrome no me funciona la Redireccion.

    Responder
    • Carlos Dk
      febrero 27, 2019

      En principio el código es javascript, así que debería de funcionar sin problema en cualquier navegador. ¿Te da algún error o warning en la consola del navegador? o ¿simplemente no se ejecuta?

      Ya me dices, por que como decía, debe de funcionar en cualquier navegador.

      Responder
      • CBGS
        marzo 1, 2019

        Hola, pasa que lo que quiero hacer es que al momento de precionar un boton este me mande una pestaña con un pdf. y al momento de regresar a la pestaña original esta ya aya sido redireccionada.
        tengo 3 archivos recetapdf.php, index.php (carpeta mReceta) e index.php (carpeta mPacientes.)
        Quiero lograr que al momento precionar el boton del index de mReceta me abra una pestaña con el recetapdf.php y al mismo tiempo la pestaña index de mReceta redireccione a mPacientes.

        Ahora… use el Script y lo probe en mozilla y me funciono a la perfección es decir hace tal cual lo que esperaba..
        el problema es que al abirir el sys en chorme esto ya no pasa de la misma manera, es verdad que si redirecciona pero tiene que estar la pestaña de recetapdf.php abierta.
        es decir, que al momento de yo precionar el boton me abre la pestaña peor no me redirecciona hasta que vulvo a precionar el boton pero esta vez sin cerrar la pestaña que me despliega con el pdf…

        CODIGO SCRIPT

        function redireccion(){
        var dominio = “http://localhost/sysmision/mPacientes”+$(“#dominio”).val();
        window.location.href=dominio;

        }

        ACCION DEL FROM PARA GENERAR LA PESTAÑA Y AGARRAR LOS DATOS DEL PACIENTE:
        <form action="PDF/pdfReceta.php?id= ” method=”POST” target=’blank’>

        BOTON EN EL QUE AGREGO LA FUNCION CON UN ONCLICK;
        Generar Receta

        Responder
        • Carlos Dk
          marzo 1, 2019

          El problema viene por separar ambas llamadas, una va por JS y otra por el action del DOM. Lo mejor es que unifiques ambas redirecciones desde una misma función JS, en otras palabras: Cuando llamadas a la función redirección, realiza la apertura de una nueva página dentro de redireccion() y redirecciona dentro de si misma a la página de mpacientes.

          De esta manera se ejecuta siguiendo el mismo hilo de ejecución. Otra manera puede hacer extraños dependiendo de como se ejecute la secuencia dentro del navegador.

          Espero haberme explicado. Sino siempre puedes volver a preguntar e intento explicarlo de otra manera.
          Salud!

          Responder
  3. Francisco
    diciembre 7, 2019

    Como se puedo pasar parámetros al redireccionar una página en jquery o javascript

    Responder
    • Carlos Dk
      diciembre 8, 2019

      Puedes pasarlos por el método GET por la propia url:

      tudominio.com?variable1=elvalor&variable2=valor2

      Es una manera 🙂

      Responder

Leave A Reply Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Busca en la web

Recomiendo

Software ERP empresarial

Categorías

  • Miscelanea (129)
  • Tutoriales formativos (622)

Ponte en contacto

+34 654380491

hola@carlosdk.com

Torre del Mar (Málaga)

Enlaces rápidos

  • Universo Dk
  • Contacto
  • Blog

Soy social

  • Twitter
  • Linkedin
  • Youtube

Newsletters

Suscríbete para enterarte de lo último que estoy haciendo. No lo usaré para enviarte SPAM inútil 😉

Esta web la he diseñado con cariño en Andalucía por Carlos Dk