0

Muy buenas, necesitaria llamar a una funcion javascript desde el evento "onclick", pero desde la parte javascript tambien, referencio el boton con documentgetelementbyId y asigno directamente el evento onclick. Pero me da error el evento, lo importante es llamar al evento desde javascript y no desde la etiqueta button de HTML.

function showHide () { // Definir elemento

 let div = document.getElementById("div-servicios");
 if (!div) {
    // No existe, hay que crearlo
    div = document.createElement("div");
    div.setAttribute("id", "div-servicios");
    document.body.appendChild(div);

    var servicio1 = document.createElement("a");
    servicio1.innerHTML = "This is a paragraph.";
    servicio1.setAttribute("class","servicios");
    div.appendChild(servicio1);

    var servicio2 = document.createElement("a");
    servicio2.innerHTML = "This is a paragraph.";
    servicio2.setAttribute("class","servicios");
    div.appendChild(servicio2);

    var servicio3 = document.createElement("a");
    servicio3.innerHTML = "This is a paragraph.";
    servicio3.setAttribute("class","servicios");
    div.appendChild(servicio3);
    // Retardar para que aparezca con transición
    setTimeout(showHide, 50);
} else {
    // Mostrar u ocultar
    div.classList.toggle('activo');
}

}

let boton = document.getElementById("boto-servicio").onclick = showHide;

</SCRIPT>
<STYLE>

#div-servicios {
        height: 100%;
        background-color:#DD9933;
        color:white;
        position: fixed;
        z-index: 1; 
        right:-250px;
        overflow-x: hidden;
        padding-top: 30px;
        transition: 1s;
        width:250px;
        transition:all 0.5s ease;
    }
    #div-servicios.activo{
        right:0;
    }
    .servicios{
        padding: 18px 18px 18px 32px;
        text-decoration: none;
        font-size: 25px;
        color: white;
        display: block;
    }

#boton-servicio{}

</STYLE>
3
  • Cuál es el error ?
    – user128299
    Commented el 5 jul. 2020 a las 19:52
  • Me pone que el evento onclick no funciona.. PD me ha faltado poner el botón con el id=botón-servicio en el HTML.. Pero igualmente me da el mismo error..
    – EricGG
    Commented el 5 jul. 2020 a las 20:00
  • Este problema es derivado de aquí, por favor no hagas nuevas preguntas, edita la que ya tienes agregando los nuevos requerimientos.
    – Triby
    Commented el 5 jul. 2020 a las 20:06

1 respuesta 1

1

Entiendo la lógica que implementas, sin embargo para que el evento sea "reconocido" por la pagina debes de agregarlo a el escuchador de eventos de JS.

Por lo que en vez de:

let boton = document.getElementById("boto-servicio").onclick = showHide;

Deberías de usar:

let boton = document.getElementById("boto-servicio");
boton.addEventListener('click',showHide);

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.