首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >页面加载时将焦点设置在HTML输入框上

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

Stack Overflow用户
提问于 2010-08-02 03:31:03
回答 3查看 212.5K关注 0票数 108

我试图在页面加载时将默认焦点设置在输入框上(例如: google)。我的页面非常简单,但是我不知道该怎么做。

这是我到目前为止所得到的:

代码语言:javascript
复制
<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>

为什么它不能工作,而它却工作得很好?

代码语言:javascript
复制
<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>

非常感谢您的帮助:-)

EN

回答 3

Stack Overflow用户

发布于 2010-08-02 03:42:34

你可以使用html5的自动聚焦属性(适用于除IE9及更低版本以外的所有当前浏览器)。只有当你的脚本是IE9或更早的版本,或者是其他浏览器的旧版本时,才调用它。

代码语言:javascript
复制
<input type="text" name="fname" autofocus>
票数 347
EN

Stack Overflow用户

发布于 2016-03-31 18:44:40

这是IE的一个常见问题,解决这个问题很简单。向输入添加两次.focus()。

修复:-

代码语言:javascript
复制
function FocusOnInput() {
    var element = document.getElementById('txtContactMobileNo');
    element.focus();
    setTimeout(function () { element.focus(); }, 1);
}

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

票数 5
EN

Stack Overflow用户

发布于 2015-09-17 01:11:56

您还可以使用:

代码语言:javascript
复制
<body onload="focusOnInput()">
    <form name="passwordForm" action="verify.php" method="post">
        <input name="passwordInput" type="password" />
    </form>
</body>

然后在你的JavaScript中:

代码语言:javascript
复制
function focusOnInput() {
    document.forms["passwordForm"]["passwordInput"].focus();
}
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/3383429

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档