当页面在没有 javascript 支持的情况下加载时，如何将光标（自动聚焦）放置在文本框中？答案

【问题标题】：How to place the cursor (auto focus) in text box when a page gets loaded without javascript support?当页面在没有 javascript 支持的情况下加载时，如何将光标（自动聚焦）放置在文本框中？
【发布时间】：2013-08-05 22:35:49
【问题描述】：

我有一个带有一些文本字段的表单，我想在页面加载时将光标（自动聚焦）放在表单的第一个文本字段上。

我想在不使用 javascript 的情况下做到这一点。

【问题讨论】：

<input.... tabindex="1" />

标签： css html

【解决方案1】：

是的，它可以在不支持 javascript..
我们可以使用html5 自动对焦属性
例如：

<input type="text" name="name" autofocus="autofocus" id="xax" />

如果在文本字段中使用它 (autofocus="autofocus") 意味着当页面加载时文本字段会获得焦点.. 更多详情：
http://www.hscripts.com/tutorials/html5/autofocus-attribute.html

【讨论】：

JSX/React 的适当大小写实际上是 autoFocus。

【解决方案2】：

只需在第一个输入或文本区域中添加autofocus。

<input type="text" name="name" id="xax" autofocus="autofocus" />

【讨论】：

至少在 Chrome 中，autofocus 不起作用，但 autofocus="autofocus" 可以。

【解决方案3】：

这将起作用：

OnLoad="document.myform.mytextfield.focus();"

【讨论】：

@putvande - 标题确实说“使用 javascript”，所以让他休息一下。
他说没有 JavaScript 支持。

【解决方案4】：

<body onLoad="self.focus();document.formname.name.focus()" >

formname is <form action="xxx.php" method="POST" name="formname" >
and name is <input type="text" tabindex="1" name="name" />

it works for me, checked using IE and mozilla.
autofocus, somehow didn't work for me.

【讨论】：

OP 说“没有 javascript”。

【解决方案5】：

对于那些像我一样玩弄的人来说的扩展。

以下作品（来自 W3）：

<input type="text" autofocus />
<input type="text" autofocus="" />
<input type="text" autofocus="autofocus" />
<input type="text" autofocus="AuToFoCuS" />

需要注意的是，这在 CSS 中不起作用。 IE。你不能使用：

.first-input {
    autofocus:"autofocus"
}

至少它对我不起作用......

【讨论】：

【解决方案6】：

很简单，您只需在想要的输入中将属性 autofocus 设置为 on

<form action="exemple.php"  method="post">
   <input name="wantedInput" autofocus="on">
   <input type="submit" value="go"  >
</form>

【讨论】：

【解决方案7】：

有时，要确保光标位于文本框内，您只需执行以下操作：单击文本框，当显示菜单时，单击“设置文本框格式” 然后单击“文本框”选项卡，最后通过向下箭头修改所有四个边距（左、右、上和下），直到每个边距出现“0”。

【讨论】：