30.evento_onload_js.html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Evento onLoad JavaScript</title>
</head>
<body>

	<h1>Evento onLoad JavaScript</h1>

	<p>El evento onLoad se ejecuta cuando cargamos una página en el navegador. Uno de los usos más frecuentes es para fijar el foco en algún control de un formulario, para que el operador no tenga que activar con el mouse dicho control.</p>

	<p>Este evento está asociado a la etiqueta body. La página completa es:</p>

	<hr>

	<xmp>
		<body onLoad="activarPrimerControl()">

			<script>

				function activarPrimerControl() {
					document.getElementById('nombre').focus();
				}

			</script>

			<form>

				Ingrese su nombre:
				<input type="text" id="nombre"><br>

				Ingrese su edad:
				<input type="text" id="edad"><br>

				<input type="button" value="Confirmar">

			</form>
			
		</body>
	</xmp>

	
	<hr>

	<p>En la marca body inicializamos el evento onLoad con la llamada a la función activarPrimerControl:</p>
	

	<xmp>	
	<body onLoad="activarPrimerControl()">
	</xmp>

	<p>La función da el foco al control text donde se cargará el nombre:</p>
	
	<xmp>
	function activarPrimerControl(){

	    document.getElementById('nombre').focus();
	}
	</xmp>


	
</body>
</html>