Question

我有一个简单的html页面，当我在Google Chrome中加载它时，我希望光标进入单个textarea。这不起作用 - 这就是我所拥有的

<html>
    <body OnLoad="document.box.focus()">
        <textarea name="box" rows="2000" cols="80">
        </textarea>
    </body>
</html>

似乎无法弄清楚我在说什么元素：

Uncaught TypeError: Cannot call method 'focus' of undefined

这样做的正确方法是什么？

Answer 1

使用id和getElementById：

<html>
    <body OnLoad="document.getElementById('theTextBox').focus()">
        <textarea id="theTextBox" name="box" rows="2000" cols="80">
        </textarea>
    </body>
</html>

Chrome不会使name值混淆全局命名空间（全局命名空间位于window而不是document）。

从技术上讲，可以执行此操作：

<html>
    <body OnLoad="window.theTextBox.focus()">
        <textarea id="theTextBox" name="box" rows="2000" cols="80">
        </textarea>
    </body>
</html>

...因为id被转储到全局命名空间中（甚至可能由W3C以这种方式指定），遗憾的是。但是您可以在该命名空间中发生冲突（例如，如果您有var theTextBox;），而getElementById则意味着直接使用id值。

Answer 2

您收到该错误消息，因为您无法按名称访问DOM元素作为document对象的属性。您应该使用document.getElementsByName()来访问共享给定名称的所有元素的数组（在您的简单情况下，您使用document.getElementsByName('box')[0].focus()来访问单个textarea）。

或者，最好你应该在该元素上设置一些ID（如<textarea id="box" rows="2000" cols="80" ...>），然后使用document.getElementById()访问元素，这样你就可以得到一个元素。

如何让Google Chrome在页面加载时将光标放在此textarea元素中？

2 个答案: