Question

我想在我的网页加载时将文本框聚焦。如果你去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"/>

Answer 1

为您的文字输入autofocus属性。它具有相当不错的浏览器支持，但并不完美。我们可以很容易地填充这个功能;我冒昧地写下了一个例子。只需将它放在文档的底部（这样当它运行时，元素已经存在），它就会找到你的autofocus元素（注意：你应该只有一个，否则你可以得到inconsistent results），并把注意力集中在它上面。

(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

Answer 2

Jonathan Sampson的HTML5解决方案可能是最好的。如果你使用jQuery，steo的样本也应该可以使用。为了完整，这里为所有浏览器和IE10 +

提供简单的JS解决方案

window.addEventListener("load",function() {
  document.getElementById("namanyay-search-box").focus();
});

Answer 3

$(document).ready(function(){

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

或者您可以在$(window).load()

上试用

如何在我的网页加载时将文本框设置为焦点

3 个答案: