Estoy tratando de interceptar el clic de un botón para hacer algo antes y después.
¿Cómo desencadenar el clic original?
const el = document.querySelector(selector); if (!el) { return; } # Save original onclick const onclick = el.onclick; # Change onlick el.onclick = async function (event) { console.log('Before click'); # TODO: call the orignal onclick? <-------- ??? onclick.call(event); console.log('After click'); }me sale el siguiente resultado
BEFORE CLICK Uncaught (in promise) TypeError: onclick is nullEse es un comportamiento un poco extraño. Pero creo que puedes usar: eventos onhover y onblur . https://www.w3schools.com/cssref/sel_hover.asp
Dado que solo puede tener un controlador onclick a la vez (al usar Element.onclick ), solo necesitamos invocar la función anterior dentro de nuestra nueva función. Aquí está la versión modificada de su código como probablemente pretenda:
var selector = ".blue"; window.onload = function() { const el = document.querySelector(selector); if (!el) { return; } // Add an initial onclick to test el.onclick = function(event) { console.log("first onclick called"); }; // Save original onclick const onclick = el.onclick; // Change onlick el.onclick = function(event) { console.log('Before click'); // Call the orignal onclick if (onclick !== null) { onclick(event); } console.log('After click'); } } <div class="red">Red</div> <div class="blue">Blue (click me)</div> También tenga en cuenta que puede usar EventTarget.addEventListener para agregar múltiples eventListener en su lugar sin necesidad de manejar el antiguo eventListener