Así que hace unos días, tuve un pequeño problema. Mi sitio web tiene un menú de encabezado normal y quería automatizarlo con javascript. Cuando trato de encontrar errores, encontré un pequeño problema que puedes ver en la imagen:
Mi menú funciona bien todo el tiempo, pero después de crear el código javascript:
<!-- header begin --> <div id="nav-placeholder"> <script> $.get("nav.html", function(data) { $("#nav-placeholder").replaceWith(data); }); </script> </div> <!-- header close -->Este código hizo que mi menú se cargara desde el archivo nav.html, okei finalmente. Cuando cargo mi menú desde nav.html, no funciona bien, pero si uso el código normalmente en el archivo index.html, funciona muy bien.
¿Quizás me perdí algo? Solo sucede en la versión móvil, después de presionar cualquier enlace en el menú de hamburguesas.
¡Gracias!
Mi primer comentario:
Está reemplazando datos en div. nav-placeholder , que reemplazará el script. Por lo tanto, mantenga el script fuera de ese div.
<script> $.get("nav.html", function(data) { $("#nav-placeholder").replaceWith(data); }); </script> <div id="nav-placeholder"> </div> Acerca de su problema:
Obtiene todo el contenido de nav.html . Entonces, cuando intente cargar el contenido desde dentro de nav.html , no funcionará como se esperaba. Por lo tanto, haga una copia de nav.html y asígnele el nombre content.html más o menos. Luego use content.html en ambos archivos.
Nota:
Asegúrese de que la ruta se proporcione correctamente