select接收焦点时的文本框的所有内容（Vanilla JS或jQuery）
当文本框获得焦点时，什么是Vanilla JS或jQuery解决scheme将select文本框的所有内容？
$(document).ready(function() { $("input:text").focus(function() { $(this).select(); } ); }); <input type="text" onfocus="this.select();" onmouseup="return false;" value="test" />
$(document).ready(function() { $("input:text") .focus(function () { $(this).select(); } ) .mouseup(function (e) {e.preventDefault(); }); });
$(document).ready(function() { $("input[type=text]").focus().select(); });
这不仅仅是一个Chrome / Safari的问题，我经历了一个非常类似于Firefox 18.0.1的行为。 有趣的是，这不会发生在MSIE上！ 这里的问题是第一个强制取消input内容的mouseup事件，所以忽略第一个事件。
$(':text').focus(function(){ $(this).one('mouseup', function(event){ event.preventDefault(); }).select(); });
timeOut方法导致一个奇怪的行为，并阻止每个鼠标事件，你不能删除select再次点击input元素。
ü疯狂的家伙… jquery不是JavaScript，在某些情况下更容易使用。
看看这个例子：
<textarea rows="10" cols="50" onclick="this.focus();this.select()">Text is here</textarea>
来自Css trics
我的解决scheme是使用超时。 似乎工作正常
$('input[type=text]').focus(function() { var _this = this; setTimeout(function() { _this.select(); }, 10); });
这也将在iOS上工作：
<input type="text" onclick="this.focus(); this.setSelectionRange(0, 9999);" />
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/select
这里的答案帮了我一点，但是当点击Chrome中的向上/向下button时，我在HTML5数字input字段中遇到了问题。
如果您单击其中一个button，并将鼠标hover在button上，数字将保持不断变化，就像您按住鼠标button一样，因为鼠标hover在被丢弃。
我解决了这个通过删除mouseup处理程序，一旦它被触发如下：
$("input:number").focus(function () { var $elem = $(this); $elem.select().mouseup(function (e) { e.preventDefault(); $elem.unbind(e.type); }); });
希望这有助于未来的人们
我知道内联代码是不好的风格，但我不想把它放到.js文件中。 没有jQuery的作品！
<input type="text" value="blah blah" onfocus="this.select(); this.selAll=1;" onmouseup="if(this.selAll==0) return true; this.selAll=0; return false;"></input>
这将工作，试试这个 –
<input id="textField1" onfocus="this.select()" onmouseup="return false" />
在Safari / IE 9和Chrome中工作，虽然我没有得到在Firefoxtesting的机会。
通过结合几个函数调用，我能够稍微改进Zach的答案。 这个答案的问题是，它完全禁用onMouseUp，从而阻止你点击文本框一旦焦点。
这是我的代码：
<input type="text" onfocus="this.select()" onMouseUp="javascript:TextBoxMouseUp();" onMouseDown="javascript:TextBoxMouseDown();" /> <script type="text/javascript"> var doMouseUp = true; function TextBoxMouseDown() { doMouseUp = this == document.activeElement; return doMouseUp; } function TextBoxMouseUp() { if (doMouseUp) { return true; } else { doMouseUp = true; return false; } } </script>
这比Zach的答案略有改善。 它在IE中完美工作，在Chrome中完全不起作用，并且在FireFox（从字面上看，每隔一段时间）就交替成功地工作。 如果有人知道如何使它在FF或Chrome中可靠地工作，请分享。
无论如何，我想我会分享我能做的更好的一点。
像@Travis和@Mari，我想在用户点击时自动select，这意味着阻止mouseup事件的默认行为，但不阻止用户点击。 我在IE11，Chrome 45，Opera 32和Firefox 29（这些是我目前已经安装的浏览器）下工作的解决scheme是基于鼠标单击中涉及的事件序列。
当你点击一个没有焦点的文本input时，你会得到这些事件（除其他外）：
-
mousedown：回应你的点击。 默认处理将在必要时提高focus并设置select开始。 -
focus：作为默认处理的一部分。 -
mouseup：点击的完成，其默认处理将设置select结束。
当你点击一个已经有焦点的文本input时， focus事件被跳过。 正如@Travis和@Mari一样，敏锐地注意到，只有在focus事件发生时，才能防止mouseup的默认处理。 然而，由于没有“ focus没有发生”的事件，我们需要推断这一点，我们可以在mousedown处理程序中做。
@ Mari的解决scheme要求导入jQuery，这是我想要避免的。 @ Travis的解决scheme通过检查document.activeElement 。 我不知道为什么他的解决scheme不适用于所有的浏览器，但还有另外一种方法来跟踪文本input是否有焦点：只需按照focus和blur事件。
以下是适用于我的代码：
var blockMouseUp = false; var customerInputFocused = false; txtCustomer.onfocus = function () { try { txtCustomer.selectionStart = 0; txtCustomer.selectionEnd = txtCustomer.value.length; } catch (error) { txtCustomer.select(); } customerInputFocused = true; }; txtCustomer.onblur = function () { customerInputFocused = false; }; txtCustomer.onmousedown = function () { blockMouseUp = !customerInputFocused; }; txtCustomer.onmouseup = function () { if (blockMouseUp) return false; };
我希望这对某个人有帮助。 🙂
我知道这里已经有很多答案了 – 但是这个到目前为止是缺less的。 一个解决scheme，也与阿贾克斯生成的内容一起工作：
$(function (){ $(document).on("focus", "input:text", function() { $(this).select(); }); });
onclick="this.focus();this.select()"
什么是JavaScript或jQuery解决scheme，当文本框获得焦点时将select文本框的所有内容？
您只需添加以下属性：
onfocus="this.select()"
例如：
<input type="text" value="sometext" onfocus="this.select()">
（老实说，我不知道为什么你需要别的东西。）
$('input').focus(function () { var self = $(this); setTimeout(function () { self.select(); }, 1); });
编辑：Per @ DavidG的请求，我不能提供详细信息，因为我不知道为什么这个工作，但我相信这是有关的事件向上或向下传播的焦点事件或任何它和input元素得到通知它受到关注。 设置超时会让元素有一点时间来实现。
如果将事件链接在一起，我相信它消除了使用.one的需要，正如本主题中其他地方所build议的那样。
例：
$('input.your_element').focus( function () { $(this).select().mouseup( function (e) { e.preventDefault(); }); });
注意：如果您使用ASP.NET进行编程，则可以使用C＃中的ScriptManager.RegisterStartupScript运行脚本：
ScriptManager.RegisterStartupScript(txtField, txtField.GetType(), txtField.AccessKey, "$('#MainContent_txtField').focus(function() { $(this).select(); });", true );
或者只是在其他答案中build议的HTML页面中input脚本。
HTML：
Enter Your Text : <input type="text" id="text-filed" value="test">
使用JS：
var textFiled = document.getElementById("text-filed"); textFiled.addEventListener("focus", function() { this.select(); });
使用JQuery：
$("#text-filed").focus(function() { $(this).select(); } );
使用React Js：
在渲染函数的各个组件中 –
<input type="text" value="test" onFocus={e => this.selectAllValue.bind(this, e.target)} />
在与你的function相同的组件 –
selectAllValue(quantity) { quantity.select(); }
我把这个播种在哪里，完美地工作！
$('input').on('focus', function (e) { $(this) $(element).one('mouseup', function () { $(this).select(); return false; }) .select(); });
这工作对我来说（张贴，因为它不是在答案，但在评论）
$("#textBox").focus().select();
我的解决scheme是：
var mouseUp; $(document).ready(function() { $(inputSelector).focus(function() { this.select(); }) .mousedown(function () { if ($(this).is(":focus")) { mouseUp = true; } else { mouseUp = false; } }) .mouseup(function () { return mouseUp; }); });
所以mouseup通常会起作用，但是在input焦点后不会取消select
