¿Cómo obtengo el elemento previamente enfocado en JavaScript?

Question

Tengo un formulario HTML con varias entradas de texto. Quiero borrar el elemento que tenía el foco inmediatamente anterior a cuando se presiona el botón 'Borrar'. ¿Cómo obtengo ese elemento en JavaScript?

Nota: Se reformuló para tener en cuenta los comentarios.

Answer 1

Cuando hace clic en el botón "borrar", solo el elemento enfocado es el botón "borrar". Tendrás que solucionarlo. (desencadenar evento onblur)

Answer 2

Como menciona Génesis, el botón de borrar tendrá el foco cuando se haga clic. Sin embargo, es posible que pueda solucionar esto teniendo un evento onBlur para su formulario que almacenara la identificación del elemento previamente tocado en una entrada variable o de forma oculta.

Answer 3

var focused, inputs=document.getElemntsByTagName('input'); 
for (var i=0, input; i<inputs.length && input = inputs[i]; i++) { 
    if (input.type === 'text') { 
     // Better use addEventListener and attachEvent, I'm just too lazy to type that on my phone 
     input.onfocus = function() { 
      focused = this; 
     } 
    } 
} 

O en jQuery: var focused; $('input:text').focus(function(){focused = this;});

Than, cuando se quiere borrar el elemento enfocado, focused.value='';

Answer 4

crear una variable global para almacenar el id del elemento con foco actual,

var cur_id; 

llame a una función para onblur de cada uno de los elementos y pase la identificación

<input type="text" id="name" name="name" onBlur="setId(this.id)"> 

y escribir el conjunto de la identificación a la variable global desde esa función

function setId(id) { 
    cur_id = id; 
} 

y escribir una función para onclick del botón de limpieza, como este

function clear() { 
    document.getElementById(cur_id).value = ""; 
} 

Answer 5

La forma más sencilla es almacene una referencia a document.activeElement dentro del evento mousedown en el botón, aunque este es un enfoque centrado en el mouse y no funcionará para los "clics" de botones desde teclados y otros dispositivos.

Demostración en directo: http://jsfiddle.net/tEP6w/

Código:

var clearButton = document.getElementById("clear"); 
var previousActiveElement = null; 

clearButton.onmousedown = function() { 
    previousActiveElement = document.activeElement; 
}; 

clearButton.onclick = function() { 
    if (previousActiveElement && previousActiveElement != this) { 
     previousActiveElement.value = ""; 
    } 
}; 

Un mejor enfoque sería para almacenar una referencia a document.activeElement que el botón está a punto de recibir el foco. Sin embargo, esto es un poco complicado de lograr muy bien en todos los navegadores.

Answer 6

Trabajando en las ideas arriba, y si está trabajando con un formulario, puede definir una entrada oculta y asignarle un valor de ID de la última entrada de centrado:

<input type="hidden" id="focused_element" value=""> 

$('input:text, textarea').focus(function() { 
    $('#focused_element').val($(this).attr('id')); 
}); 

y luego recoger el valor en el momento posterior apropiado:

var focused = $('#focused_element').val();