How can I make event.srcElement work in Firefox and what does it mean?

JavascriptFirefoxCross Browser

Javascript Problem Overview


there is an if statement on my company's website that makes one web page imcompatible with firefox

if(event.srcElement.getAttribute("onclick") == null){ 
...code..
document.mainForm.submit();
}

I've commented out the if statement conditions and now its working with forefox. My question is, what is event.srcElement.getAttribute("onclick"), is it important, would it cause problems in the future. also, is there something similar i can replace the condition with so that it works on firefox?

Edit:

 function gotoRDManagerPT(PTId, bDDetailId) {
		if(!proceed()) return false;
		var target = event.target || event.srcElement; 
		if(event.target.getAttribute("onclick") == null) { 
			document.mainForm.displayRDManagerPT.value = "true";
			document.mainForm.PTId.value = PTId;
			document.mainForm.bDDetailId.value = bDDetailId;
			document.mainForm.submit();
		}
	}

Javascript Solutions


Solution 1 - Javascript

srcElement is proprietary property originally coming from IE. The standardized property is target:

var target = event.target || event.srcElement;

if(target.onclick == null) { // shorter than getAttribute('onclick')
    //...
    document.mainForm.submit();
}

Also have a look at quirksmode.org - Event properties for more cross browser information.


Regarding the question what it is doing:

event.target / event.srcElement contains a reference to the element the event was raised on. getAttribute('onclick') == null checks whether a click event handler is assigned to element via inline event handling.

Is it important? We cannot say because we don't know what the ...code.. is doing.

Solution 2 - Javascript

In IE the event object is available in the window object already; in Firefox, it's passed as a parameter in the event handler.

Example

JavaScript:

function toDoOnKeyDown(evt)

{

    //if window.event is equivalent as if thie browser is IE then the event object is in window
    //object and if the browser is FireFox then use the Argument evt

    var myEvent = ((window.event)?(event):(evt));
    //get the Element which this event is all about 

    var Element = ((window.event)?(event.srcElement):(evt.currentTarget));
    //To Do -->

}

HTML:

<input type="text" id="txt_Name" onkeydown="toDoOnKeyDown(event);"/>

As you notice when we called the function inside the html we have added a parameter event just in case the browser is Firefox.

I have read in an article that the event object in IE is called window.event and in Firefox we have to put it as a parameter.

In case you need it to be attached in the code:

document.getElementById('txt_Name').onkeydown = function(evt) {
    var myEvent = ((window.event)?(window.event):(evt));


    // get the Element which this event is all about 

    var Element = ((window.event)?(event.srcElement):(evt.currentTarget));
    // To Do -->
};

Solution 3 - Javascript

Try quick fix as follows:

Include in code:

let target = event.target || event.srcElement;

and change

event.srcElement.XXXXX to target.XXXXX

this solves the issue with Firefox.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Question124697View Question on Stackoverflow
Solution 1 - JavascriptFelix KlingView Answer on Stackoverflow
Solution 2 - JavascriptMarwanView Answer on Stackoverflow
Solution 3 - JavascriptPankaj ShrivastavaView Answer on Stackoverflow