Nunca antes había usado funciones anidadas, y esta tarea aparentemente simple me está dando problemas. Cuando ejecuto este código, solo funciona la primera función, y la segunda no responde por completo (pero no me da un mensaje de error). ¿Qué estoy haciendo mal?
function toggleMobileMenu() { setTimeout(function showMobileMenu() { var x = document.getElementById("content"); if (x.style.display === "none") { x.style.display = "block"; } else { x.style.display = "none"; } }, 1000); function toggleClasses() { var element = document.getElementById("myNav"); element.classList.toggle("fixed"); var element = document.getElementById("overlay"); element.classList.toggle("fixed"); var element = document.getElementById("site-header"); element.classList.toggle("fixed"); } }Como @rayhatfield menciona en los comentarios, debe invocar la función para que se ejecute.
Si la función está definida dentro de otra función (anidada) como en este caso, pero no se invoca o llama , entonces no se ejecutará.
function toggleMobileMenu() { setTimeout(function showMobileMenu() { var x = document.getElementById("content") if (x.style.display === "none") { x.style.display = "block" } else { x.style.display = "none" } }, 1000) function toggleClasses() { var element = document.getElementById("myNav") element.classList.toggle("fixed") var element = document.getElementById("overlay") element.classList.toggle("fixed") var element = document.getElementById("site-header") element.classList.toggle("fixed") } toggleClasses() // <--- invoke the function } La primera parte funciona correctamente porque setTimeout() hace una devolución de llamada a la función pasada a los parámetros después de una cierta cantidad de milisegundos. Y luego no pasa nada porque solo estás definiendo una función dentro de otra función.