Question

I know how to do this in jQuery, but how to do it in Javascript?

    if ((evt.which == arrLeftKey || evt.keyCode == arrLeftKey) && document.getElementById(TopMenuID).getElementsByTagName('a') === document.activeElement) {
                alert("LEFT");
} 

The above if statement isn’t working, and I’m not really sure why. Nothing is being alerted. I have a nav bar called TopMenuID and if one of the a tags inside of it have focus, I want to alert LEFT when the left key is pressed. What am I doing wrong?

Answer 1

getElementsByTagName('a') returns an array, but you are comparing it to activeElement thus the two will NEVER be equal.

If you want to know if the activeElement is in your menu, then you can look up the parent chain of the activeElement and just see if you run into the TopMenuID element.

function doesContain(item, parent) {
    var obj = item.parentNode;
    while (obj && obj !== document.documentElement && obj.nodeType !== 11) {
        if (obj === parent) {
            return(true);
        }
        obj = obj.parentNode;
    }
    return(false);
}

if ((evt.which == arrLeftKey || evt.keyCode == arrLeftKey) && doesContain(document.activeElement, document.getElementById(TopMenuID) {
    alert("LEFT");
}