选择聚焦文本

Select text on focus

本文关键字：文本 聚焦 选择      更新时间：2023-09-26

我正在尝试使用jQuery在只读输入框中选择文本，这就是我所拥有的：

    $('input').focus(function(){
        $(this).select();
    })

然而，当我点击输入时，它会快速选择所有文本，"闪烁"，然后返回到未选中的正常状态。

对此有什么想法吗？

我使用以下代码使其工作。我的chrome版本：Version 24.0.1312.52

$("#inputid").on("focus",function(e){
    $(this).select();
});
$("#inputid").on("mouseup",function(e){
    return false;
});

希望这能帮助。。。

这两种技术的组合对我很有效，尽管我的盒子不是只读的。正常的select（）在Firefox中立即生效。然而，在Safari中，mouseup和事件排序会导致它在mouseup时再次取消选择自己。我附加了一个mouseup事件，该事件在mouseup应该完成干扰之后（如果文本仍然是要替换的默认文本），在延迟计时器上启动一个选择。

示例：

$('#your_selector').focus(function() {
  $(this).select();
}).mouseup(function() {
  if ($(this).val() === 'Enter search terms here'){
    var _self = this;
    setTimeout(function(){ _self.select()},30)
  }
});

问题在于输入框是只读的（正如您在问题中提到的那样）
（这不是jQuery或javascript问题）

IE、FF和Opera没有问题。但是Chrome和Safari展示了你提到的问题。。

看起来是一个不同的实现，我不确定你能否解决这个问题。。

演示到展示（在控制台打开的所有浏览器中检查）
http://jsfiddle.net/gaby/N9qzq/3/

 <input onClick="this.select()" value="Blabla und Blublu" type="text" />

应该工作

这里发生了一点奇怪的事情。focus发生在鼠标放下时，但光标放置发生在click上（即mousedown后面跟着mouseup）。放置光标后，任何选择都将消失。

因此，您很可能希望保留focus事件（用于选项卡和trigger），但也要添加click或mouseup处理程序，以便在单击时进行实际选择。

$('input[type="text"]').focus(function() {
    $(this).select();
}).click(function() {
    if ($(this).val() === 'Your default value')
    {
        $(this).select();
    }
});

if的存在使得一旦用户在您的输入中自定义了文本，他们就可以在不选择文本的情况下四处点击。不过，这并不真正适用于readonly文本输入，因此可以安全地将其删除。

编辑：代码似乎充其量是不一致的，所以这可能不是解决方案。

根据Gaby在他们的帖子中所写的内容，这个解决方案似乎对我有效：

$('input').focus(function(){
    var _self = this;
    setTimeout(function(){   console.log(_self.select())},100)
    })

我在浏览器上测试时遇到了这个问题。谷歌也有这个问题，我想Opera也是。Firefox，IE可以。我通过这个解决了问题。在onclick和onfocus上都选择（）。

由于人们提到的不一致性，你能用CSS来模拟你的选择吗？当输入接收到焦点时，应用CSS color和background-color，使其看起来像是被选中的。

相关文章：