使用Enter键作为JavaScript中的标签时，如何跳过隐藏字段

Question

I have a asp.net web application that is being developed for IE11 and I am trying to have the Enter key function the same as the Tab key. Most of the time it works fine with the code below. However if there are fields that are disabled or in a div that is hidden the Enter key does not advance to the next enabled and visible field.

Here is what i have:

I have the following on my main div so it applies to all text boxes: onkeydown="changeEnterToTab()

The functions fire properly but the getNextElement function returns a field that is not displayed or is disabled.

Any ideas?

    function changeEnterToTab() {
        var node = (event.target) ? event.target : ((event.srcElement) ? event.srcElement : null);
        if ((event.keyCode == 13) && ((node.type == "text") || (node.type == "radio"))) {
            getNextElements(node).focus();
            return false;
        }
    }

    function getNextElement(field) {
        var form = field.form;
        for (var e = 0; e < form.elements.length; e++) {
            if (field == form.elements[e]) {
                e++;
                break;
            }
        }
        e++;
        debugger;
        while (form.elements[e % form.elements.length].type == "hidden") {
            e++;
        }
        return form.elements[e % form.elements.length];
    }

Answer 1

Put all your hidden controls at the top of the form so the user will only "tab" to the rest visible control.

You can exclude the control from the tab order by set its tabIndex to -1

 
 
 
  
  <input type="text" name="username" tabIndex="-1" />
 
  

Answer 2

I did not find an actual answer to this question but I got around the issue by reordering the TabIndex completely to handle the instances where the controls are hidden/disabled.

Thanks for the ideas though guys.