Los eventos son acciones que pueden ser detectados por JavaScript.
Actuar para un evento
El siguiente ejemplo muestra la fecha en que se hace clic en un botón:
Ejemplo
<html>
<head>
<script type="text/javascript">
function displayDate()
{
document.getElementById("demo").innerHTML=Date();
}
</script>
</head>
<body>
<h1>My First Web Page</h1>
<p id="demo"></p>
<button type="button" onclick="displayDate()">Display Date</button>
</body>
</html>
<head>
<script type="text/javascript">
function displayDate()
{
document.getElementById("demo").innerHTML=Date();
}
</script>
</head>
<body>
<h1>My First Web Page</h1>
<p id="demo"></p>
<button type="button" onclick="displayDate()">Display Date</button>
</body>
</html>
Eventos
Mediante el uso de JavaScript, tenemos la capacidad de crear páginas web dinámicas. Los eventos son acciones que pueden ser detectados por JavaScript.
Cada elemento de una página web tiene ciertos eventos que pueden desencadenar un JavaScript.Por ejemplo, podemos usar el evento onClick de un elemento de botón para indicar que una función se ejecutará cuando un usuario hace clic en el botón. Se definen los eventos en las etiquetas HTML.
Ejemplos de eventos:
- Un clic del ratón
- Una página web o una carga de imágenes
- Pasar el ratón sobre un punto caliente en la página web
- Selección de un campo de entrada en un formulario HTML
- Envío de un formulario HTML
- Un golpe de teclado
Nota: Los eventos se utiliza normalmente en combinación con las funciones y la función no se ejecutará antes de que el evento!
onLoad y onUnload
Los eventos onLoad y onUnload se activan cuando el usuario entra o sale de la página.
El evento onLoad se utiliza a menudo para comprobar el tipo de visitante navegador y versión de navegador y cargar la versión correcta de la página web sobre la base de la información.
Tanto el onLoad y eventos onUnload también se utiliza a menudo para hacer frente a las cookies, que debe tomarse cuando un usuario entra o sale de una página. Por ejemplo, usted podría tener un emergente de lo pregunte el nombre del usuario en su primera llegada a la página. El nombre se almacena en una cookie. La próxima vez que el visitante llega a su página, usted podría tener otro mensaje diciendo algo como: "Bienvenido Juan Pérez".
onfocus, onblur y onChange
Los eventos del onfocus, onblur y onChange se utilizan a menudo en combinación con la validación de campos de formulario.
A continuación se muestra un ejemplo de cómo utilizar el evento onChange. La función de checkEmail () se llama cuando el usuario cambia el contenido del campo:
<input type="text" size="30" id="email" onchange="checkEmail()" />
onSubmit
El evento onsubmit se utiliza para validar todos los campos del formulario antes de enviarlo.
A continuación se muestra un ejemplo de cómo utilizar el evento onSubmit. El checkForm () la función se llama cuando el usuario hace clic en el botón de enviar en el formulario. Si los valores de los campos no son aceptadas, el submit se debe cancelar. El checkForm function () devuelve verdadero o falso. Si devuelve true el formulario se haya presentado, de lo contrario el submit será cancelado:
<form method="post" action="xxx.htm" onsubmit="return checkForm()">
onMouseOver
El evento onmouseover se puede utilizar para activar una función cuando el usuario pasa el ratón sobre un elemento HTML:
