4

当我的网页加载时，我希望一个文本框成为焦点。如果您访问 google.com，您可以看到文本框已经成为焦点。这就是我想要的。

这是我的表格：

<form id="searchthis" action="#" style="display:inline;" method="get">
  <input id="namanyay-search-box" name="q" size="40" x-webkit-speech/>
  <input id="namanyay-search-btn" value="Search" type="submit"/>
4

3 回答 3

3

为您的文本输入提供autofocus属性。它有相当好的浏览器支持，虽然并不完美。我们可以很容易地填充这个功能；我冒昧地在下面写了一个例子。只需将它放在文档的底部（这样当它运行时，元素已经存在），它会找到你的autofocus元素（注意：你应该只有一个，否则你可能会得到不一致的结果），然后将注意力集中在它上面.

(function () {

    // Proceed only if new inputs don't have the autofocus property
    if ( document.createElement("input").autofocus === undefined ) {

        // Get a reference to all forms, and an index variable
        var forms = document.forms, fIndex = -1;

        // Begin cycling over all forms in the document
        formloop: while ( ++fIndex < forms.length ) {

            // Get a reference to all elements in form, and an index variable
            var elements = forms[ fIndex ].elements, eIndex = -1;

            // Begin cycling over all elements in collection
            while ( ++eIndex < elements.length ) {

                // Check for the autofocus attribute
                if ( elements[ eIndex ].attributes["autofocus"] ) {

                    // If found, trigger focus
                    elements[ eIndex ].focus(); 

                    // Break out of outer loop
                    break formloop;

                }

            }

        }

    }

}());

经过一些初步测试，这似乎一直支持 Internet Explorer 6、Firefox 3 等。

在您选择的浏览器中进行测试：http: //jsfiddle.net/jonathansampson/qZHxv/show

于 2013-04-13T15:48:27.480 回答
2

Jonathan Sampson 的 HTML5 解决方案可能是最好的。如果您使用 jQuery，steo 的示例也应该可以工作。为了完整起见，这里有适用于所有浏览器和 IE10+ 的纯 JS 解决方案

window.addEventListener("load",function() {
  document.getElementById("namanyay-search-box").focus();
});
于 2013-04-13T15:50:42.087 回答
0 
$(document).ready(function(){

..code.. 
$('.textbox-class-name').focus();
..code.. 
});

或者你可以试试$(window).load()

于 2013-04-13T15:43:41.210 回答