Crossbrowser equivalent of explicitOriginalTarget event parameter

Question

Does anyone know of crossbrowser equivalent of explicitOriginalTarget event parameter? This parameter is Mozilla specific and it gives me the element that caused the blur. Let's say i have a text input and a link on my page. Text input has the focus. If I click on the link, text input's blur event gives me the link element in Firefox via explicitOriginalTarget parameter.

I am extending Autocompleter.Base's onBlur method to not hide the search results when search field loses focus to given elements. By default, onBlur method hides if search-field loses focus to any element.

Autocompleter.Base.prototype.onBlur = Autocompleter.Base.prototype.onBlur.wrap(
function(origfunc, ev) {
    var newTargetElement = (ev.explicitOriginalTarget.nodeType == 3 ? ev.explicitOriginalTarget.parentNode: ev.explicitOriginalTarget); // FIX: This works only in firefox because of event's explicitOriginalTarget property
    var callOriginalFunction = true;
    for (i = 0; i < obj.options.validEventElements.length; i++) {
        if ($(obj.options.validEventElements[i])) {
            if (newTargetElement.descendantOf($(obj.options.validEventElements[i])) == true || newTargetElement == $(obj.options.validEventElements[i])) {
                callOriginalFunction = false;
                break;
            }
        }
    }
    if (callOriginalFunction) {
        return origFunc(ev);
    }
}
);


new Ajax.Autocompleter("search-field", "search-results", 'getresults.php', { validEventElements: ['search-field','result-count'] });

Thanks.

score 9 · Accepted Answer · answered Oct 07 '08 at 20:17

9

There is no equivalent to explicitOriginalTarget in any of the other than Gecko-based browsers. In Gecko this is an internal property and it is not supposed to be used by an application developer (maybe by XBL binding writers).

answered Oct 07 '08 at 20:17

Sergey Ilinsky

31,255
9
54
56

Thanks Sergey. Maybe I should start writing my own method using event delegation instead of trying to extend onBlur method of Autocompleter. With event delegation and using some global variables I can fix this. – matte Oct 08 '08 at 07:08

score 4 · Answer 2 · answered Feb 22 '15 at 21:02

4

2015 update... you can use event.relatedTarget on Chrome. Such a basic thing, hopefully the other browsers will follow...

answered Feb 22 '15 at 21:02

ss ulrey

298
1
8

1

Unfortunately, it looks like Firefox doesn't have or expose .explicitOriginalTarget anymore, nor have they implemented .relatedTarget yet, as of July 2015. https://bugzilla.mozilla.org/show_bug.cgi?id=962251 – Judah Gabriel Himango Jul 15 '15 at 19:40
1

@JudahHimango Firefox 55 still supports `explicitOriginalTarget`. Regarding `relatedTarget`, it's not the same at all. – icl7126 Jul 09 '17 at 06:58

score 3 · Answer 3 · edited May 06 '12 at 00:42

IE srcElement does not contain the same element as FF explicitOriginalTarget. It's easy to see this: if you have a button field with onClick action and a text field with onChange action, change the text field and move the cursor directly to the button and click it. At that point the IE srcElement will be the text field, but the explicitOriginalTarget will be the button field. For IE, you can get the x,y coordinates of the mouse click from the event.x and event.y properties.

Unfortunately, the Chrome browser provides neither the explicitOriginalTarget nor the mouse coordinates for the click. You are left to your own devices to figure out where the onChange event was fired from. To do this, judicious use of mousemove and mouseout events can provide mouse tracking which can then be inspected in the onChange handler.

score 3 · Answer 4 · answered Feb 11 '10 at 18:43

The rough equivalent for Mozilla's .explicitOriginalTarget in IE is document.activeElement. I say rough equivalent because it will sometimes return a slightly different level in the DOM node tree depending on your circumstance, but it's still a useful tool. Unfortunately I'm still looking for a Google Chrome equivalent.

score 1 · Answer 5 · answered Oct 07 '08 at 19:35

1

Looks like it is more designed for extension writers than for Web design...

I would watch the blur/focus events on both targets (or potential targets) and share their information.
The exact implementation might depend on the purpose, actually.

answered Oct 07 '08 at 19:35

PhiLho

40,535
6
96
134

I also thought watching blur/focus events on both targets but if Firefox has a specific parameter (explicitOriginalTarget) for that, maybe the other browsers have too. Maybe not a parameter but a hack. – matte Oct 07 '08 at 19:46

score 0 · Answer 6 · answered Sep 18 '22 at 19:41

In case of form submit events, you can use the submitter property in all modern browser (as of 2022).

let form = document.querySelector("form");
form.addEventListener("submit", (event) => {
  let submitter = event.submitter; //either a form input or a submit button
});

score 0 · Answer 7 · edited Mar 07 '12 at 19:31

0

For IE you can use srcElement, and forced it.

if( !selectTag.explicitOriginalTarget )
    selectTag.explicitOriginalTarget = selectTag.srcElement;

edited Mar 07 '12 at 19:31

answered Mar 07 '12 at 18:46

Kotei

17
1

Crossbrowser equivalent of explicitOriginalTarget event parameter

7 Answers7

Linked