El onclickevento en JavaScript le permite, como programador, ejecutar una función cuando se hace clic en un elemento.
Ejemplo de botón al hacer clic
Click me function myFunction() { alert('Button was clicked!'); } En el ejemplo simple anterior, cuando un usuario hace clic en el botón, verá una alerta en su navegador Button was clicked!.
Agregar onclick dinámicamente
El onclickevento también se puede agregar mediante programación a cualquier elemento utilizando el siguiente código en el siguiente ejemplo:
click on this element.
var p = document.getElementById("foo"); // Find the paragraph element in the page p.onclick = showAlert; // Add onclick function to element function showAlert(event) { alert("onclick Event triggered!"); } Nota
Es importante tener en cuenta que al usar onclick podemos agregar solo una función de escucha. Si desea agregar más, simplemente use addEventListener (), que es la forma preferida de agregar un detector de eventos.
En el ejemplo anterior, cuando un usuario hace clic en el paragraphelemento del html, verá una alerta onclick Event triggered.
Evitar la acción predeterminada
Sin embargo, si adjuntamos onclickenlaces ( aetiqueta HTML ), es posible que deseemos evitar que ocurra la acción predeterminada:
Guides function myAlert(event) { event.preventDefault(); alert("Link was clicked but page was not open"); } En el ejemplo anterior, evitamos el comportamiento predeterminado del aelemento (enlace de apertura) usando event.preventDefault()dentro de nuestra onclickfunción de devolución de llamada.
MDN
Otros recursos
Adjunto de controlador de eventos jQuery .on ()