JavaScript 将焦点设置为 HTML 表单元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17500704/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JavaScript set focus to HTML form element
提问by tenstar
I have a web form with a text box in it. How do I go about setting focus to the text box by default?
我有一个带有文本框的网络表单。默认情况下，如何将焦点设置到文本框？
Something like this:
像这样的东西：
<body onload='setFocusToTextBox()'>
so can anybody help me with it? I don't know how to set focus to the text box with JavaScript.
所以有人可以帮我吗？我不知道如何使用 JavaScript 将焦点设置到文本框。
<script>
function setFocusToTextBox(){
//What to do here
}
</script>
回答by mohkhan
Do this.
做这个。
If your element is something like this..
如果你的元素是这样的..
<input type="text" id="mytext"/>
Your script would be
你的脚本将是
<script>
function setFocusToTextBox(){
document.getElementById("mytext").focus();
}
</script>
回答by a better oliver
For what it's worth, you can use the autofocusattribute on HTML5 compatible browsers. Works even on IE as of version 10.
对于它的价值，您可以autofocus在 HTML5 兼容浏览器上使用该属性。从版本 10 开始，甚至可以在 IE 上运行。
<input name="myinput" value="whatever" autofocus />
回答by Khanh TO
Usually when we focus on a textbox, we should also scroll into view
通常当我们关注一个文本框时，我们也应该滚动到视图中
function setFocusToTextBox(){
var textbox = document.getElementById("yourtextbox");
textbox.focus();
textbox.scrollIntoView();
}
Check if it helps.
检查它是否有帮助。
回答by Richard Rebeco
If your code is:
如果您的代码是：
<input type="text" id="mytext"/>
And If you are using JQuery, You can use this too:
如果您使用的是 JQuery，您也可以使用它：
<script>
function setFocusToTextBox(){
$("#mytext").focus();
}
</script>
Keep in mind that you must draw the input first $(document).ready()
请记住，您必须先绘制输入 $(document).ready()
回答by sipp
For plain Javascript, try the following:
对于普通的 Javascript，请尝试以下操作：
window.onload = function() {
document.getElementById("TextBoxName").focus();
};
回答by sipp
I used to just use this:
我曾经只是使用这个：
<html>
<head>
<script type="text/javascript">
function focusFieldOne() {
document.FormName.FieldName.focus();
}
</script>
</head>
<body onLoad="focusFieldOne();">
<form name="FormName">
Field <input type="text" name="FieldName">
</form>
</body>
</html>
That said, you can just use the autofocus attribute in HTML 5.
也就是说，您可以在 HTML 5 中使用 autofocus 属性。
Please note: I wanted to update this old thread showing the example asked plus the newer, easier update for those still reading this. ;)
请注意：我想更新这个旧线程，显示所询问的示例，以及为仍在阅读本文的人提供更新、更简单的更新。;)
回答by Kamil Kie?czewski
If your <input>or <textarea>has attribute id=mytextthen use
如果您的<input>或<textarea>具有属性，id=mytext则使用
mytext.focus();
function setFocusToTextBox() {
mytext.focus();
}<body onload='setFocusToTextBox()'>
<form>
<input type="text" id="mytext"/>
</form>
</body>回答by Mac
As mentioned earlier, document.formsworks too.
如前所述，document.forms 也能工作。
function setFocusToTextBox( _element ) {
document.forms[ 'myFormName' ].elements[ _element ].focus();
}
setFocusToTextBox( 0 );
// sets focus on first element of the form
回答by ??l?j?
window.onload is to put focus initially onblur is to put focus while you click outside of the textarea,or avoid text area blur
window.onload 最初是将焦点放在 onblur 是在您单击 textarea 外部时放置焦点，或避免文本区域模糊
<textarea id="focus"></textarea>
<script>
var mytexarea=document.getElementById("focus");
window.onload=function()
{
mytexarea.focus();
}
mytextarea.onblur=function(){
mytextarea.focus();
}
</script>
