Question

我有这个jQuery来检测光标在文本框内的时间。我们的想法是突出显示文本框所在的表格行。

$(".text").on("focus", function() { //do something });

问题是这段代码似乎在文本框内注册了tab键。当我点击Tab键时，光标仍将移动到下一个文本框。但是它总是在框中插入一个标签空间!!

这是最意想不到的，我必须承认我有点困惑......

对此事的任何帮助都会非常棒，谢谢。

Answer 1

给每一行像这样的tabindex var i=2; $('tr').each($(this).attr('tabindex',i++))

Answer 2

A previous answer已通过检查keyCode以查看是否与9匹配来解决了Tab键的问题。但是，制表符的宽度不同（也依赖于个人喜好），尽管它通常是两个或四个空格。因此，当检测到选项卡keydown事件时，可以将该空格附加到输入文本的值。

在下面的代码中，我选择使用四个空格：

$(function () {
    $(".text").on("focus", function () {
        console.log("box selected");
    }).on("keydown", function(e) {
        if ((e.keyCode || e.which) == 9) {
            e.preventDefault();
            $(this).val($(this).val() + "    ");
        }
    });
});

请参阅此处的概念验证小提琴：http://jsfiddle.net/teddyrised/5cjbcy9o/1/

Answer 3

您在alert()事件中发送的focus似乎以奇怪的方式打断了事情。您可以通过在发送警报之前设置一个短暂的超时来解决此问题;确保在文本框获得焦点并且处理了标签输入后发送警报。

setTimeout(function() { alert("box selected"); }, 1);

http://jsfiddle.net/5cjbcy9o/2/

如何阻止我的代码将标签放入我的文本框中

3 个答案: