在Chrome中，当在文本区域内按下Tab键时，使用preventDefault()方法防止默认行为。

Question

我知道之前已经有类似的问题被问过，但是我遇到的情况与我在 Stack Overflow 上找到的不太一样。

我有一个表单，我将其拆分成几个 jQuery 手风琴选项卡。 我希望用户可以在选项卡 1 下填写文本字段，然后按下 Tab 键自动打开选项卡 2 并将焦点放在该选项卡中的文本字段上。 我遇到的问题是如何防止 Chrome 浏览器中 Tab 键的默认行为。

$("form#new_story").keydown(function (e) {
    if(!e) var e = window.event;
    var keyCode = e.keyCode || e.which; 
    if (keyCode == 9) {
        e.preventDefault();
        alert("tab was keyed");
    }
});

我已在Chrome、FF和Safari中进行了测试。在FF和Safari中表现良好，但当使用Chrome的用户按下Tab键时，在事件触发之前会在文本字段中输入实际的制表符。我想停止这种行为，但是制表符显然是在事件触发之前输入的。有没有办法阻止这种情况发生？

- chuck w

---

标签在 keydown 事件之前输入？听起来不太可能。但为了防止这种情况发生，您可以挂钩 keypress 并抑制它。 - Bergi

keypress 没有捕获到 tab 键的按下（我知道 keypress 在旧版本的 ie 中无法捕获非字符键。但是不知道它在 Chrome 中也无法捕获非字符键。无论如何，我刚刚找到了问题所在。这是 jquery 手风琴和 jquery 验证之间非常有趣的交互。将其作为下面的答案提交。） - chuck w

Answer 1

原来问题是由jquery validate引起的。我使用以下选项验证表单中的每个文本字段：

$("form#new_story").validate({
                      ignore: [],
                      onkeyup: false,  //stop eager validation of fields so to not hit server each time user clicks a key in the email field
                      onfocusout: true,
                      ...
                    };

一旦我设置了onfocusout: false，我就能够按预期捕获tab键按下事件。

我不知道为什么会这样。可能是jQuery手风琴或jQuery验证中的一个错误。

- chuck w