Cómo obtener el elemento activo de un formulario con JavaScript
Anuncio
Cómo obtener el elemento activo de un
formulario con JavaScript
Para obtener el elemento activo de un formulario en Internet Explorer lo podemos
hacer fácilmente con la propiedad activeElement, pero en navegadores Mozilla, como
Firefox, no existe esta propiedad, aunque eso no quiere decir que no podamos
hacerlo.
Podemos averiguar qué elemento está activo recorriendo los elementos del formulario
y asignándoles una función en el evento onfocus y onblur que nos permitirá averiguar
qué elemento está activo.
<script type=”text/javascript”>
var activeElement;
function blurFunc() {
activeElement = null; /* Cuando el elemento deja de estar activo el elemento activo
pasa a ser nulo (null) */
}
function focusFunc(evento) {
if(!evento) { // Para IE
evento = window.event;
activeElement = evento.srcElement; /* Cuando un elemento se activa (focus) lo
indicamos */
} else { // Para otros navegadores
activeElement = evento.target;
}
alert(activeElement.name); // Lo utilizaremos para hacer la prueba
}
function init() {
for (var i = 0; i < document.forms.length; i++) {
for(var j = 0; j < document.forms[i].elements.length; j++) {
document.forms[i].elements[j].onfocus = focusFunc;
document.forms[i].elements[j].onblur = blurFunc;
}
}
}
window.onload = init;
</script>
El código que acabamos de ver, lo pondremos entre <head> y </head>. Luego, para
probarlo, utilizaremos este formulario entre <body> y </body>
<form name=”HolaMundo” action=””>
Nombre: <input type=”text” name=”nombre”>
Apellidos: <input type=”text” name=”apellidos”>
<input type=”button” name=”activo” value=”Enviar”>
</form>
Cuando probemos este formulario, tanto con IE como con Firefox, al pulsar sobre un
campo del formulario nos aparecerá una ventana con el nombre del elemento activo.
