1

Quisiera saber si hay alguna forma de activar una función en Js que muestre elementos (div) ocultos (cambiando el css), después de haber ya redirigida la pagina, intenté cargar el mismo js en los dos archivos, pero soy novato en esto y no encuentro una solución, gracias

Javascript:

function Mostrar() {
  document.getElementById("caja").style.display = "block";
}
document.querySelector('#botones')
  .addEventListener('click', () => {
    window.location.href = 'www.prueba.com';
    Mostrar();
  });

Botón para redireccionar (primera pagina)

<div id="botones">
  Entrar 
</div>

Div oculto en segunda pagina:

<div id="caja" style="display:none;"></div>

gracias de antemano

2 respuestas 2

1

Una función no se puede ejecutar después de navegar a otra página. De la misma forma, lo que estás haciendo no es redireccionar, con location.href estás navegando.

Ahora bien, si la página sigue pertenenciendo al mismo dominio, es decir, si estabas (por ejemplo) en http://localhost/login y después navegas a http://localhost/dashboard, puedes almacenar datos en el localStorage para que la página renderice elementos cuando haya cargado.

Para guardar un item en el localStorage usa lo siguiente:

let pageSettings = {
    showDiv: true
}

localStorage.setItem('pageSettings', JSON.stringify(pageSettings));

Por lo tanto el callback del eventListener debería quedar así:

document.querySelector('#botones')
  .addEventListener('click', () => {

    let pageSettings = {
    showDiv: true
    };

    localStorage.setItem('pageSettings', JSON.stringify(pageSettings));

    window.location.href = 'www.prueba.com';
    // Comentamos esto porque no va a funcionar.
    //Mostrar();
  });

Y en www.prueba.com tienes que añadir lo siguiente:

<div id="caja" style="display:none;"></div>
<script>
    let pageSettings = JSON.parse(localStorage.getItem('pageSettings'));

    if (pageSettings.showDiv) {
        document.getElementById('caja').style.display = block; // O lo que necesites.
    };
</script>

Recuerda añadir esto antes de cerrar el body, si la página aún no se ha cargado y estás intentando aplicar estilos, va a devolver error porque no ha encontrado el elemento que necesita modificar.

1
  • Muchas gracias por tu ayuda, si funciono en un mismo dominio, saludos (:
    – Oren
    Commented el 30 jun. 2021 a las 21:25
0

No puedes cambiar algo de una pagina que todavía no esta cargada (no esta presente en el navegador).

Puedes optar por dos vías.

  1. Que tu pagina ya se vean los divs que quieres que se vean.
  2. Al invocar la pagina web, pasarle un parametro por GET.

A continuación te paso un ejemplo de la segunda vía, pues la primera no tiene mayor dificultad.


pagina html principal

document.querySelector('#botones')
  .addEventListener('click', () => {
    window.location.href = 'www.prueba.com?accion=clicked';
});

pagina prueba.com

//en el load del html
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
var accion= urlParams.get('accion')
console.log(accion); // clicked

if(accion == clicked){
    //cambias todo lo que quieras
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.