2

tengo la siguiente inquietud: Mi código funciona, pero al ver la consola me arroja "ReferenceError: toggle is not defined"

Acá dejo el código

<div class="container-menu" id="icon-menu">
    <div class="bar-1"></div>
    <div class="bar-2"></div>
    <div class="bar-3"></div>
</div>


window.onload = function(){ 

    var icoMenu = document.getElementById('icon-menu');

    icoMenu.onclick = function myFunction() {
        icoMenu.classList.toggle('changeMenu');
    }
    icoMenu.addEventListener('click', toggle, false);   

};

Alguna solución ?

3
  • ¿Dónde estás ejecutando tu código? A mí no me aparece ningún error en la consola. JSFiddle Commented el 29 nov. 2016 a las 15:17
  • @Error404 desde Wordpress
    – DCdesign
    Commented el 29 nov. 2016 a las 16:10
  • La verdad que nunca he usado Wordpress pero supongo que será por la situación del script. Si te fijas, en el link que te he puesto en el comentario no aparece ningún error en consola debido a que lo carga onload. En caso de que lo cambies a "no-wrap in body" entonces aparece ese error. Commented el 29 nov. 2016 a las 16:12

1 respuesta 1

0

El error es que la función toggle no esta definida.

Al ver tu código, hay algo que pareciera estar de mas... ¿por que?

  • Asignas a icoMenu en el onclick, que ejecute myFunction
  • Luego usando addEventListener, para que en el evento click, ejecute toggle (función que no existe)

Aparentemente uno de los 2 esta de más, no?

Una solución seria la siguiente:

window.onload = function(){ 
    var icoMenu = document.getElementById('icon-menu');
  
    function toggle() {
        icoMenu.classList.toggle('changeMenu');
    }
    icoMenu.addEventListener('click', toggle, false);
}
.container-menu {
  background-color: #f00;
}
.container-menu.changeMenu {
  background-color: #ff0;
}
<div class="container-menu" id="icon-menu">
    <div class="bar-1">Bar 1</div>
    <div class="bar-2">Bar 2</div>
    <div class="bar-3">Bar 3</div>
</div>

1
  • Funciona, perfecta solución !
    – DCdesign
    Commented el 29 nov. 2016 a las 16:45

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.