Alternative to event.srcElement.id

Question

Currently I have a function that works perfectly for IE, Chrome and Safari in order to get the ID name of a textbox I'm placing a focus on within a Gridview.

function onTextFocus() {
        alert(event.srcElement.id);
    }

The function is called upon during a RowDataBound for the gridview:

protected void ItemGridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        ((TextBox)e.Row.FindControl("txtQuantity")).Attributes.Add("onfocus", "onTextFocus();");            
    }
}

However it doesn't work for Firefox as it doesn't recognize srcElement. So I'm looking for an alternative that would work for all browsers. After scouring Google I came up with these alternatives but I either get an undefined error or ReferenceError. Any ideas why?

function onTextFocus() {
        alert(this.id);
        alert(event.currentTarget.id); 
        alert(event.target.id);    
        alert(event.currentTarget); 
        alert(event.target);                          
        alert($(this).attr('id'));
        alert($(obj).attr("id"));            
        alert($(this).id);
        alert($(this).get(0).id);            
        alert($(this).prop("id"));
    }

Answer 1

Begin Update: Now that I see the dotNet Code:

protected void ItemGridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        ((TextBox)e.Row.FindControl("txtQuantity")).Attributes.Add("onfocus", "onTextFocus(event);");            
    }
}

If you add the event parameter it should pass it

But depends on what you really want to do there might be a better way.

End Update

The short answer is use event.target here is the specification on MDN https://developer.mozilla.org/en-US/docs/Web/API/Event/target it shows it is supported by the major browser. In your case you have to add the parameter eventin your event-handling function.

function onTextFocus(event) {
    alert(event.target.id);
}

if you don't declare the event Parameter, you cannot access it. (It also depends on how you are binding the event)

With standard Javascript (check out https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener), short example here:

   window.onload = function(){
    
     document.getElementById("test").addEventListener('focus', onclick1);

    function onclick1(event){
        console.info(event.target.id);
    }
 };

<input type="text" id="test" />

with jQuery (check out this link http://api.jquery.com/on/) Short example here:

$( function(){
    
     $("#test1").on('focus', onclick1);

    function onclick1(event){
        console.info(event.target.id);
    }
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test1" />

Update:
(btw.: You could use the global window.event property, which holds the current event, BUT it is recomended to use the event which is passed to the event handler)

Answer 2

Instead event.srcElement use event.target

https://developer.mozilla.org/es/docs/Web/API/Event/target