如何在页面加载时自动选择输入字段及其中的文本答案

【问题标题】：how to auto select an input field and the text in it on page load如何在页面加载时自动选择输入字段及其中的文本
【发布时间】：2010-09-17 16:01:29
【问题描述】：

页面加载后，我想将光标移动到特定字段。没问题。但我还需要选择并突出显示该文本字段中的默认值。

【问题讨论】：

【解决方案1】：

来自http://www.codeave.com/javascript/code.asp?u_log=7004：

var input = document.getElementById('myTextInput');
input.focus();
input.select();

&lt;input id="myTextInput" value="Hello world!" /&gt;

【讨论】：

【解决方案2】：

在您的输入标签中，放置以下内容：

onFocus="this.select()"

【讨论】：

这仅适用于 FireFox。在 Chrome 中，您可以通过添加“onmouseup='return false'”来解决此问题，但这不会解决 Edge 中的问题，如果您使用键盘导航到元素中，也不会解决问题。
刚刚尝试过，也可以在 Chrome 上运行 (Version 55.0.2883.95 (64-bit))
这很好用，因为我的输入太多而且我使用的是 Class 而不是 ID

【解决方案3】：

试试这个。这适用于 Firefox 和 chrome。

<input type="text" value="test" autofocus="autofocus" onfocus="this.select()">

【讨论】：

【解决方案4】：

在页面加载时执行：

window.onload = function () {
  var input = document.getElementById('myTextInput');
  input.focus();
  input.select();
}

&lt;input id="myTextInput" value="Hello world!" /&gt;

【讨论】：

【解决方案5】：

我找到了一个非常简单的方法，效果很好：

<input type="text" onclick="this.focus();this.select()">

【讨论】：

【解决方案6】：

使用 jquery 时...

html:

<input type='text' value='hello world' id='hello-world-input'>

jquery:

$(function() {
  $('#hello-world-input').focus().select();
});

【讨论】：

【解决方案7】：

    var input = document.getElementById('myTextInput');
    input.focus();
    input.setSelectionRange( 6,  19 );

    &lt;input id="myTextInput" value="Hello default value world!" /&gt;

在文本字段中选择特定文本

你也可以用like

input.selectionStart = 6;
input.selectionEnd = 19;

【讨论】：

【解决方案8】：

使用autofocus 属性可以很好地用于文本输入和复选框。

<input type="text" name="foo" value="boo" autofocus="autofocus"> FooBoo
<input type="checkbox" name="foo" value="boo" autofocus="autofocus"> FooBoo

【讨论】：

【解决方案9】：

让输入文本字段在页面加载时自动获得焦点：

<form action="/action_page.php">
  <input type="text" id="fname" name="fname" autofocus>
  <input type="submit">
</form>

【讨论】：

【解决方案10】：

在你的输入标签中使用这样的自动对焦

<input type="text" autofocus>

【讨论】：