Question

我在Stack Overflow上找到this question，并使用了顶部答案中给出的代码。

除此之外，它的表现非常出色，但有一个问题;在我的页面上我有多个textareas。事实上，我使用的选择器只是"textarea"。

然而，当从一个textarea到另一个textarea'tabbing'时（使用Tab键跳转到下一个），显然焦点事件不会触发，并且文本不会被选中。

如何通过点击和Tab键修改该代码？

JSFiddle在这里; http://jsfiddle.net/qQDbZ/我在Chrome上，点击文本区域时确实选择了全部，而标签则没有。

Answer 1

我能够通过以下解决方法实现此目的：

$('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中测试了上述内容。我稍后会测试更多版本;我现在很高兴。在向前拨动时工作，向后移动+制表。

绑定到keydown无效。

我仍然认为这种解决方法应该是不必要的。我最好的猜测是webkit浏览器将标签检测为textarea中的按键，因此取消选择文本，就像在textarea中选择了一些文本然后开始输入一样，任何浏览器都是如此。

Answer 2

$('input[type="textarea"]').keydown(function(event){
    var keypressed = event.keyCode || event.which,
    tab = 9,
    $this = $(this);

    if(keypressed === tab){
       $this.next('textarea').focus();
    }
});

不确定问题究竟是什么，但是如果你需要强制解决方案，这应该可行。

Answer 3

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

标签时选择textarea文本

3 个答案: