javascript - tab 时选择 textarea 文本

标签 javascript jquery focus textarea

我找到了 this question在 Stack Overflow 上,并使用了最佳答案中给出的代码。

除此之外它的效果非常好,但是有一个问题;在我的页面上,我有多个文本区域。事实上,我使用的选择器只是 "textarea"

但是,当从一个文本区域“跳转”到另一个文本区域(使用 Tab 键跳转到下一个文本区域)时,焦点事件显然不会触发,文本也不会被选中。

我如何修改该代码以同时通过点击和 Tab 键工作?

JSFiddle 在这里; http://jsfiddle.net/qQDbZ/我在 Chrome 上,虽然点击文本区域会全选,但 Tab 键不会。

最佳答案

我能够通过以下解决方法解决此问题:

$('textarea').focus(function() {
    var $this = $(this);
    $this.select().mouseup(function() {
        $this.off('mouseup');
        return false;
    });
}).keyup(function(e) {
    if(e.which === 9) {
        this.select();
    }
});

演示:http://jsfiddle.net/KfFPM/3/

我在 Chrome 21、Safari 6、Firefox 14、Opera 12 和 IE 9 中测试了以上内容。稍后我会测试更多版本;我现在很高兴。在 Tab 键向前和 shift+Tab 键向后时起作用。

绑定(bind)到 keydown 无效。

我仍然认为这种解决方法应该是不必要的。我最好的猜测是 webkit 浏览器将选项卡检测为文本区域内的按键,因此取消选择文本,如果您在文本区域中选择了一些文本然后开始输入,任何浏览器都会这样做。

关于javascript - tab 时选择 textarea 文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10402067/

相关文章:

android - 特定 Android Honeycomb 平板电脑(Orange Tahiti)上的奇怪焦点问题

javascript - 将动态创建的图像替换为输入中的新图像

javascript - 如何从默认的 highcharts 配置中删除小数点 .00?

javascript - django 模板循环调用 javascript 函数

javascript - $.ajax 与类型 : post and $. post 有什么区别

java - 在 Java 中同时使用鼠标监听器和按键监听器

javascript - 当父元素固定且具有相同的 z 索引时,子元素 z 索引不起作用?

javascript - 如何使ticks函数在d3.js中工作?

IE8 中的 Jquery UI : suspending sort behavior while resizing an element that is sortable and resizable

wpf - 如何根据自定义控件的子元素是否具有焦点来设置样式?