IE8 chokes on undefined var in while condition

[Ulysses69]

I have the following while condition that checks targ and manipulates it with parent as part of the while condition ... works wonders in all browsers but my IE8 browser.

It seems to choke at indexOf as targ.id may not be defined as while loop condition expands. Is there a way around this? To ensure IE does not choke.

while((targ = targ.parentNode) && targ.tagName != 'BODY' && idx.indexOf(targ.id) == -1)

[007julien]

If idx is an Array : « The indexOf() method is not supported in Internet Explorer 8 and earlier.» (w3schools.com)
Then use an object idx and test idx[targ.id]=='undefined'

[Airblader]

Or maybe better because it doesn't require you to change your implementation: Add the indexOf method to arrays if not present. You can find an exact ECMAScript implementation here.

[Ulysses69]

Thanks. Indeed, I have since implemented an indexOf function. All is working.

However, now the indexOf is working, Firefox is now triggering onclick before onkeydown is being called (double call). There are no errors as such. Originally, it was triggering the onclick after the onkeydown, so I added a stop variable to prevent double-trigger of function but now that the onclick is triggering before onkeydown, I don't know what to do. Interestingly, when the second alert appears, the box closes itself without requring the ok button to be selected. Any ideas?

var stop = "";
    var Links = document.getElementsByTagName('A');
    for (var i = 0; i < Links.length; i++) {
        if (Links[i].innerHTML != '') {
            Links[i].onkeydown = confirmLink;
            Links[i].onclick = confirmLink;
        }
    }

    function confirmLink(e) {
        ev = (e || window.event);
        if (ev.type == 'click' && stop != 'stop') {
            var obj = document.activeElement;
            findDivId(ev, obj);
        } else if (ev.type == 'keydown' && ev.keyCode == 13) {
            findDivId(ev, document.activeElement);
        }
    }

    function findDivId(e, obj) {
        objLabel = obj.innerHTML;
        var idx = ['menu'];
        var tagx = ['A'];
        var targ = e.target || e.srcElement;
        var thisRef = obj.href;
        var thisExt = obj.href.split('.').pop();
        var dad = targ.id;
        if (thisRef == undefined || thisRef == '') {
            thisRef = obj;
        }
        parentTarg = targ.parentNode;
        targID = targ.id;
        if (targID == undefined) targID = '';
        if (!Array.prototype.indexOf) {
            Array.prototype.indexOf = function (elt /*, from*/ ) {
                var len = this.length;
                var from = Number(arguments[1]) || 0;
                from = (from < 0) ? Math.ceil(from) : Math.floor(from);
                if (from < 0) from += len;
                for (; from < len; from++) {
                    if (from in this && this[from] === elt) return from;
                }
                return -1;
            };
        };
        while ((targ = parentTarg) && targ.tagName != 'BODY' && idx.indexOf(targID) == -1) {
            parentTarg = targ.parentNode;
            targID = targ.id;
        }
        var cat = 'Links';
        var dad = targ;
        var thisDad = targID;
        if (dad) {
            String.prototype.capitalize = function () {
                return this.replace(/(^|\s)([a-z])/g, function (m, p1, p2) {
                    return p1 + p2.toUpperCase();
                });
            };
            thisDad = thisDad.toLowerCase().capitalize();
            if (obj.title != '') {
                thisRef = obj.title;
            };
            if (obj.text) {
                thisText = obj.text;
            } else {
                t = obj.href;
                thisText = t.substring(t.lastIndexOf('/') + 1);
            }
            alert('Category:	' + "\t" + cat + "\n" + 'Action:		' + thisText + ' (' + e.type + ')' + "\n" + 'Label: ' + "\t\t" + thisDad);
        };
        if (e.type == 'click' || (e.type == 'keydown' && e.keyCode == 13)) {
            stop = 'stop';
        };
    };

[Airblader]

I'm not entirely sure what you mean – onclick and onkeydown are events generally triggered by different input devices (mouse, keyboard). Which one is fired first simply depends on what you do first.

However, what stops you from implementing the "blocking logic" for both events? For both events check that the stop variable is still false and if it's triggered set it to true in both cases too.

It'd be easier to take an actual look at your code if you told us what exactly it does. It'd also be helpful to try to reduce it to a minimal example reproducing the problem (although it's not that much code right now, so it'd be fine). In any case, you should move adding the capitalize method to the prototype to outside of the event handler – it's completely unnecessary to add it every single time.

[Airblader]

By the way:

if (ev.type == 'click' && stop != 'stop') {
            var obj = document.activeElement;
            findDivId(ev, obj);
        } else if (ev.type == 'keydown' && ev.keyCode == 13) {
            findDivId(ev, document.activeElement);
        }

What's the purpose of this? In both cases you do exactly the same.

[Ulysses69]

Originally Posted by Airblader

By the way:

if (ev.type == 'click' && stop != 'stop') {
            var obj = document.activeElement;
            findDivId(ev, obj);
        } else if (ev.type == 'keydown' && ev.keyCode == 13) {
            findDivId(ev, document.activeElement);
        }

What's the purpose of this? In both cases you do exactly the same.

Yes. Right now they are indeed the same. I actually tried a few other ways to pass the correct input type into the main findDivId function and at the moment cannot fathom why the handler type is so problematic.

I have created another attemp and noticed something even more confusing ... browsers typically return key type on first focus for links, but pressing enter returns a click instead of a second key press (as you would expect). So, key press is only registered for link focus, but click is registered for entering focused link or clicking it with mouse etc ... really annoying.