在页面加载时将焦点设置为 HTML 输入框

我试图设置一个输入框的默认焦点时，页面加载(例如: 谷歌)。 我的页面非常简单，但我不知道如何做到这一点。

这是我目前为止得到的信息:

<html>
<head>
<title>Password Protected Page</title>


<script type="text/javascript">
function FocusOnInput()
{
document.getElementById("PasswordInput").focus();
}
</script>


<style type="text/css" media="screen">
body, html {height: 100%; padding: 0px; margin: 0px;}
#outer {width: 100%; height: 100%; overflow: visible; padding: 0px; margin: 0px;}
#middle {vertical-align: middle}
#centered {width: 280px; margin-left: auto; margin-right: auto; text-align:center;}
</style>
</head>
<body onload="FocusOnInput()">
<table id="outer" cellpadding="0" cellspacing="0">
<tr><td id="middle">
<div id="centered">
<form action="verify.php" method="post">
<input type="password" name="PasswordInput"/>
</form>
</div>
</td></tr>
</table>
</body>
</html>

为什么这个没问题的时候，那个却不起作用？

<html>
<head>
<script type="text/javascript">
function FocusOnInput()
{
document.getElementById("InputID").focus();
}
</script>
</head>


<body onload="FocusOnInput()">
<form>
<input type="text" id="InputID">
</form>
</body>


</html>

非常感谢您的帮助: -)

224117 次浏览
小开
最佳答案

This line:

<input type="password" name="PasswordInput"/>

应该具有 身份证属性，如下所示:

<input type="password" name="PasswordInput" id="PasswordInput"/>
小开

您还可以使用 HTML5的 autofocus 属性(适用于除 IE9以下的所有当前浏览器)。只有在 IE9或更早版本，或其他浏览器的旧版本时才调用脚本。

<input type="text" name="fname" autofocus>
小开

你也可以使用:

<body onload="focusOnInput()">
<form name="passwordForm" action="verify.php" method="post">
<input name="passwordInput" type="password" />
</form>
</body>

然后在你的 JavaScript 中:

function focusOnInput() {
document.forms["passwordForm"]["passwordInput"].focus();
}
小开

这是 IE 的常见问题之一，修复这个问题很简单。 向输入添加两次.focus ()。

解决方案:-

function FocusOnInput() {
var element = document.getElementById('txtContactMobileNo');
element.focus();
setTimeout(function () { element.focus(); }, 1);
}

并在 $(document) . ready (function (){ ... ... }上调用 FocusOnInput () ;


提交答案