0

Dentro de la página web que estoy creando al cambiar de páginas tengo que volver a cargar la página en la que me encuentre para que así cargue todo de manera correcta.

He estado mirando mucho y no he encontrado una solución espero que podáis ayudarme, probé metiendo un setInterval cada vez que se abría una nueva página para que se actualizara, pero aún así había que actualizarla manualmente y luego ya cogía la función de actualizar.

Un ejemplo sería este:

function JSONRequest() {

let request = new XMLHttpRequest();
request.open('GET', 'https://api.spoonacular.com/recipes/complexSearch?apiKey=.&number=5');
request.onload = function () {
    let todo = JSON.parse(this.responseText);
    let contenedor = document.getElementById('contenedor')
    console.log(todo)
    for (let i = 0; i < todo.results.length; i++) {

        let card = document.createElement('div')
        card.setAttribute('class', 'list-group list-boxes carta-rece')
        card.setAttribute('name', 'links')
        let enlace = document.createElement('a');
        enlace.setAttribute('href', 'prueba.html');
        // enlace.className="border border-mandarina rounded-s shadow-xxs"
        enlace.innerHTML = todo.results[i].title
        card.appendChild(enlace)
        let img = document.createElement('img');
        img.className = "img-api";
        img.setAttribute('name', 'links')
        img.src = todo.results[i].image;
        card.appendChild(img)
        contenedor.appendChild(card)

    }
    let links = document.getElementsByName('links');
    for (let i = 0; i < links.length; i++) {
        links[i].addEventListener('click', function () {
            let = local = localStorage.setItem("recetaid", JSON.stringify(todo.results[i]));

        }, false)

    }
}
request.send();

}

Al entrar en el enlace que crea a la siguiente (prueba.html) página no carga sola. En este ejemplo que muestro utilizo JavaScript, pero tampoco funciona con las páginas de PHP. Para el resto de páginas y en general la página web estoy utilizando una plantilla que se llama StickyMobile.

Gracias.

7
  • 1
    Duplicada de es.stackoverflow.com/questions/536666/…, por favor no uséis diferentes usuarios para postear preguntas idénticas...
    – Benito-B
    Commented el 26 may. 2022 a las 11:24
  • @Benito-B Perdón, me cree una cuenta no podía ya borrar ni acceder a la pregunta, entonces la volví a realizar, si sabes como borrarla te lo agradecería...
    – FDZ
    Commented el 26 may. 2022 a las 11:36
  • He pedido la intervención de un moderador para que te ayude a unificar tus cuentas y tus preguntas. Por otra parte, no queda muy claro cuál es el problema, ni el contexto en que éste ocurre. También, evita publicar tus API Keys en preguntas...
    – A. Cedano
    Commented el 26 may. 2022 a las 11:53
  • Gracias por lo de las cuentas y preguntas @A.Cedano, es que es un problema raro y no se explicarlo muy bien, te pongo en situación..., estamos en el "index.html" y queremos ir a "ejemplo.html"(en este archivo aparte del html y css hace una llamada para mostrar los datos de una API), pues al entrar desde "index.html" a "ejemplo.html" no carga nada automaticamente, asi que si quieres que la pagina cargue todo del todo hay que recargarla manualmente (con F5, por ejemplo).
    – FDZ
    Commented el 26 may. 2022 a las 12:55
  • 2
    Parece que no hacen falta dos páginas para esto. Al entrar a index.html puedes mandar a pedir los datos a la API lanzando una petición fetch o Ajax desde el DOMContentLoaded, y, si quieres seguir trayendo datos, puedes lanzar la petición cada X tiempo desde el mismo sitio. ¿Por qué te lías con dos páginas? Aparte de eso, el problema en sí mismo puede ser que la petición Ajax no esté funcionando, o que esté escrita de forma errónea. Todo eso será simple de depurar, cuando tengas claro el contexto, que es, a mi juicio, el principal problema aquí.
    – A. Cedano
    Commented el 26 may. 2022 a las 12:58

1 respuesta 1

0

Es porque debes navegar por tus directorios al usar un enlace, si este fuese a un link externo deberias usar https://pagina.com pero como debes ir a un archivo html dentro de tu proyecto debes escribir la ruta, ejemplo:

📂carpetaRaiz
    📂carpeta
        📄prueba.html
    📄index.html

entonces tu enlace deberia ser en este caso:

<a href="/carpetaRaiz/carpeta/prueba.html">Ir al enlace</a>

Puedes hacerlo de una manera mas resumida de esta forma

<a href="./carpeta/prueba.html">Ir al enlace</a>

o

<a href="../carpeta/prueba.html">Ir al enlace</a>

si el index.html esta dentro de una carpeta en la carpeta raiz ejemplo:

📂carpetaRaiz
    📂carpeta
       📄prueba.html
    📂carpeta2
       📄index.html

el primer punto antes del './' significa salir del archivo en este caso index.html, el segundo punto '..' es para salir del archivo y de la carpeta donde esta ese archivo y ya luego solo accedes a la carpeta y archivo html

/carpeta/prueba.html
2
  • Muchas gracias por la ayuda y lo bien que lo has explicado.
    – FDZ
    Commented el 2 jun. 2022 a las 8:54
  • no es nada, usualmente no se habla mucho de estas cosas por lo cual es difícil encontrar respuestas.
    – LexxCh
    Commented el 2 jun. 2022 a las 16:24

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.