GlobalEventHandlers.onclick
La propiedad onclick devuelve el manejador del evento click
del elemento actual.
click
para ejecutar algo, considera agregar la misma acción al evento keydown
, para permitirle el uso a personas que no usan mouse o pantalla táctil.Sintaxis
element.onclick = functionRef;
Donde functionRef es una función - muchas veces el nombre de la función está declarado ya en otro sitio o como una expresión de la función .Ver "JavaScript Guide:Functions" para más detalles.
el único argumento pasado a la función manejador de evento especificamente MouseEvent
object. Dentro del manejador, this
será el elemento sobre él el evento ha sido invocado.
Ejemplo
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>onclick event example</title>
<script>
function initElement() {
var p = document.getElementById("foo");
// NOTE: showAlert(); or showAlert(param); will NOT work here.
// Must be a reference to a function name, not a function call.
p.onclick = showAlert;
};
function showAlert(event) {
alert("onclick Event detected!");
}
</script>
<style>
#foo {
border: solid blue 2px;
}
</style>
</head>
<body onload="initElement();">
<span id="foo">My Event Element</span>
<p>click on the above element.</p>
</body>
</html>
O se puede usar una función anoníma, como esa:
p.onclick = function(event) { alert("moot!"); };
Notas
El evento click
se genera cuando el usuario hace clic en un elemento. El evento clic ocurrirá después de los eventos mousedown
y mouseup
.
Solo se puede asignar un controlador click
a un objeto a la vez con esta propiedad. Puede que prefiera utilizar el método EventTarget.addEventListener()
en su lugar, ya que es más flexible y forma parte de la especificación DOM Events.
Especificación
Especificación | Estatus | Comentario |
---|---|---|
HTML Living Standard La definición de 'onclick' en esta especificación. |
Living Standard |
Compatibilidad de Navegadores
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Soporte básico | (Yes) | ? | ? | ? | ? |
Feature | Android | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|---|
Soporte básico | ? | ? | ? | ? | ? | ? | ? | ? |