如何从页面中找到焦点元素

Question

I want to find which element is focused.For this I tried in the following way.

I have 2 textfields on my web page id's are field1,field2

var viewObj=Marionette.CompositeView.extend({
  events:{
      "blur #field1":"test",
      "blur #field2":"test"
   },
 test:function(){
   console.log(document.activeElement.id);
 }
});

what I want,

If you move cursor from field1 to field2 prints field2

If you move cursor from field2 to field1 prints field1

If I click anywhere outside,then I want to print something else.

I know document.activeElement.id ,but it's not working.

can anyone help me.

Thanks.

Answer 1

Use "document.activeElement" property .

But Tis property only work for thoase field which accept keystrokes .

Answer 2

If you are using JQuery:

$("body").focusin(function(event) {
    alert(event.target.id);
});

It will alert you an ID of focused element.

http://jsfiddle.net/2Lchy/9/