problem with onBlur event in IE

Question

I have this HTML:

<textarea class="question" onBlur="onBlurFun(event); return true;" 
name="aaa" id="bbb"></textarea>

And this function in JavaScript

    onBlurFun = function(event) {
 var tgt = $(event.target);
 alert(tgt.attr('id'));
    }

In IE, tgt is not properly set. What should I do to have access to calling node?

Answer 1

To check target do not pass event intead of this pass object it self like

look this code

<textarea class="question" onBlur="onBlurFun(this); return true;" 
name="aaa" id="bbb"></textarea>

 function  onBlurFun(obj) 
{
   alert(obj.id); 
}

Answer 2

event.srcElement is Internet Explorer's equivalent of event.target. jQuery normalizes this for you in event handlers applied using .bind(), so you can use event.target in Internet Explorer, but event handlers applied through HTML attributes or the DOM properties won't have the property. In your case, you could change the code to

// event.target or event.srcElement
var tgt = $(event.target || event.srcElement);

or follow June R's advice and pass in a reference to the element instead.

As a side note, there is no need to return true; for most events, but especially for onblur and onfocus since you can't cancel the default action of them anyway.

Answer 3

IE has its own global event object.

This should work

onBlurFun = function(event) {

   if (!event)
   {
     event = window.event;
     event.target = event.srcElement;
   }

   var tgt = $(event.target);
   alert(tgt.attr('id'));

}