使用 Onfocus 和 Onclick 在文本框中选择文本答案

【问题标题】：Use Onfocus and Onclick to select text in a textbox使用 Onfocus 和 Onclick 在文本框中选择文本
【发布时间】：2014-07-09 14:01:57
【问题描述】：

我试图选择文本框中的所有文本，当它被切换到文本框并单击它时。当我有 function selectField() {$(this).select();} 选择它时，我以为我有一件好事，但后来我发现我可以使用 onfocus 和 onclick 并直接使用 this.select(); 设置它们问题是当我点击文本字段时我可以做到这一点但是点击它。用小提琴来展示我在说什么http://jsfiddle.net/t9jJX/

编辑。当我单击文本框时，突出显示的文本不会保持突出显示。

【问题讨论】：

这里一切正常...我不确定您的问题是什么？
当我点击文本框时，文本不会保持选中状态。
在 IE 下运行良好，你用的是什么浏览器？
铬。还没有考虑在 IE 中进行测试。

标签： javascript jquery html

【解决方案1】：

试试这个：

$("input").on('mouseup',function(){
    $(this).focus().select(); 
});

我还删除了整个 HTML 中的 onclick 和 onfocus 属性。在 Chrome 和 IE 中测试成功。

演示：http://jsfiddle.net/t9jJX/2/

【讨论】：

【解决方案2】：

将this.select() 附加到onfocus 的问题。仅使用点击，您的代码就可以正常工作：

<input id="before" type="text" />

<input id="unit"  onclick="this.select();" type="text" />

<input id="Cost"  onclick="this.select();" type="text"  value="123" />

<input id="after" type="text"/>

编辑：这样做的原因似乎是chrome将克拉放在mouseup的文本中，但在mousedown时触发onfocus。使用 onfocus 事件进行选择不太正确，因为 chrome 会选择所有内容，然后在文本中放置克拉时取消选择。

如果您测试 onmousedown="this.select()" 和 onmouseup="this.select"，同样的行为是显而易见的

【讨论】：