我希望能够使用Tab文本框中的键来跨越四个空格。现在的方式是，Tab 键将我的光标跳转到下一个输入。
是否有一些 JavaScript 会在文本框中的 Tab 键冒泡到 UI 之前捕获它？
我了解某些浏览器（即 FireFox）可能不允许这样做。像Shift+Tab或Ctrl+这样的自定义组合键怎么样Q？
在文本框中捕获 TAB 键
IT技术
javascript
user-interface
2021-02-06 13:36:28
6个回答
即使您捕获了keydown/keyup事件，这些是 Tab 键触发的唯一事件，您仍然需要某种方式来防止默认操作（移动到 Tab 键顺序中的下一项）发生。
在 Firefox 中，您可以调用preventDefault()传递给事件处理程序的事件对象的方法。在 IE 中，您必须从事件句柄返回 false。JQuery 库preventDefault为其事件对象提供了一个方法，该方法适用于 IE 和 FF。
<body>
<input type="text" id="myInput">
<script type="text/javascript">
var myInput = document.getElementById("myInput");
if(myInput.addEventListener ) {
myInput.addEventListener('keydown',this.keyHandler,false);
} else if(myInput.attachEvent ) {
myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}
function keyHandler(e) {
var TABKEY = 9;
if(e.keyCode == TABKEY) {
this.value += " ";
if(e.preventDefault) {
e.preventDefault();
}
return false;
}
}
</script>
</body>
我宁愿制表符缩进不起作用，也不愿在表单项之间中断制表符。
如果要缩进以将代码放入 Markdown 框中，请使用Ctrl+ K（或在 Mac 上使用⌘K）。
就实际停止操作而言，当您从事件回调返回 false 时，jQuery（Stack Overflow 使用的）将阻止事件冒泡。这使使用多个浏览器的工作更轻松。
前面的答案很好，但我是坚决反对将行为与演示混合（将 JavaScript 放在我的 HTML 中）的人之一，所以我更喜欢将我的事件处理逻辑放在我的 JavaScript 文件中。此外，并非所有浏览器都以相同的方式实现事件（或 e）。您可能需要在运行任何逻辑之前进行检查：
document.onkeydown = TabExample;
function TabExample(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var tabKey = 9;
if(evt.keyCode == tabKey) {
// do work
}
}
我建议不要更改密钥的默认行为。我尽可能不碰鼠标，所以如果你让我的 Tab 键不移动到表单上的下一个字段，我会很生气。
然而，快捷键可能很有用，尤其是对于大代码块和嵌套。Shift-TAB 是一个糟糕的选择，因为它通常会将我带到表单上的前一个字段。也许 WMD 编辑器上的一个新按钮可以使用快捷键插入代码选项卡？
ScottKoon 给出的最佳答案存在问题
就这个
} else if(el.attachEvent ) {
myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}
应该
} else if(myInput.attachEvent ) {
myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}
因此，它在 IE 中不起作用。希望 ScottKoon 更新代码