根据tabindex，光标如何自动跳转到下一个可能的(未禁用的)输入字段？
I got that function (source: 100 ) but my cursor doesn't move automatically after input of 1 value: - Why?
function focusNextElement () {
//add all elements we want to include in our selection
var focussableElements = 'a:not([disabled]), button:not([disabled]), input[type=text]:not([disabled]), [tabindex]:not([disabled]):not([tabindex="-1"])';
if (document.activeElement && document.activeElement.form) {
var focussable = Array.prototype.filter.call(document.activeElement.form.querySelectorAll(focussableElements),
function (element) {
//check for visibility while always include the current activeElement
return element.offsetWidth > 0 || element.offsetHeight > 0 || element === document.activeElement
});
var index = focussable.indexOf(document.activeElement);
if(index > -1) {
var nextElement = focussable[index + 1] || focussable[0];
nextElement.focus();
}
}
}
我的输入字段的示例:
<table>
<thead></thead>
<tbody>
<tr>
<td> 1<input type="text" maxlength="1" oninput="focusNextElement(this)" id="a" name="a" tabeindex="1">. </td>
<td>3<input type="text" maxlength="1" oninput="focusNextElement(this)" id="b" name="b" tabeindex="3" disabled></td>
<td>5<input type="text" maxlength="1" oninput="focusNextElement(this)" id="c" name="c" tabeindex="5"></td></tr>
<tr>
<td>2 <input type="text" maxlength="1" oninput="focusNextElement(this)" id="d" name="d" tabeindex="2"></td>
<td>4<input type="text" maxlength="1" oninput="focusNextElement(this)" id="e" name="e" tabeindex="4"></td>
<td>6<input type="text" maxlength="1" oninput="focusNextElement(this)" id="f" name="f" tabeindex="6""></td>
</tr>
</tbody>
</table>