How do I get the previously focused element in JavaScript?
The simplest way is to store a reference to document.activeElement
within the mousedown
event on the button, although this is a mouse-centric approach and won't work for button "clicks" from keyboards and other devices.
Live demo: http://jsfiddle.net/tEP6w/
Code:
var clearButton = document.getElementById("clear");
var previousActiveElement = null;
clearButton.onmousedown = function() {
previousActiveElement = document.activeElement;
};
clearButton.onclick = function() {
if (previousActiveElement && previousActiveElement != this) {
previousActiveElement.value = "";
}
};
A better approach would be to store a reference to document.activeElement
as the button is about to receive the focus. However, this is a little tricky to achieve nicely in all browsers.
Create a global variable for storing the current focused element's id,
var cur_id;
call one function for onblur
of each of elements and pass id
<input type="text" id="name" name="name" onBlur="setId(this.id)">
and write the set the id to global variable from that function
function setId(id) {
cur_id = id;
}
and write a function for onclick of clear button, like this
function clear() {
document.getElementById(cur_id).value = "";
}
When you click "clear" button, only element focused is "clear" button. You'll have to workaround it. (trigger onblur event)