Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    May 2004
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    IE8 chokes on undefined var in while condition

    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.

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

  • #2
    Regular Coder
    Join Date
    May 2012
    Location
    France
    Posts
    216
    Thanks
    0
    Thanked 29 Times in 27 Posts
    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'
    Last edited by 007julien; 02-23-2013 at 08:55 PM.

  • #3
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    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.

  • #4
    New Coder
    Join Date
    May 2004
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts
    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?
    Code:
    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';
            };
        };
    Last edited by Ulysses69; 02-24-2013 at 03:34 PM.

  • #5
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    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.

  • #6
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    By the way:

    Code:
    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.

  • #7
    New Coder
    Join Date
    May 2004
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Airblader View Post
    By the way:

    Code:
    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.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •