JavaScript焦点()函数没有't将文本区域集中在页面加载上

JavaScript focus() function doesn't focus textarea on page load

本文关键字:集中 区域 文本 加载 焦点 函数 JavaScript      更新时间:2023-09-26

我有以下代码。

<!DOCTYPE html>
<html>
<head>
<title>Focus issue</title>
<script type='text/javascript'>//<![CDATA[ 
window.onload=function(){
  var text = document.getElementById('text')
  window.onload = function() {
    text.focus()
  }
  window.onhashchange = function() {
    text.focus()
  }
}//]]>  
</script>
</head>
<body>
  <textarea id="text"></textarea>
  <p><a href="#focus">Click to focus</a></p>
</body>
</html>

以下是上面代码的JSFiddle演示:http://jsfiddle.net/DvU63/

为什么页面加载时焦点不在文本区域框上?单击链接时,焦点确实会放在文本区域框上,但我也希望在页面加载时将焦点放在文本区框上。为什么没有发生?

注意:我知道文本区域的HTML5自动对焦属性。但这个问题是关于为什么上面的JavaScript代码没有达到我想要的效果。

您正在从onload处理程序内部执行.focus()语句,该处理程序本身在onload处理程序中定义。此内部onload将不会被调用,因为在您定义它时,onload事件已经发生。试试这个:

window.onload=function(){
  var text = document.getElementById('text')
  text.focus()
  window.onhashchange = function() {
    text.focus()
  }
}

您的演示已更新:http://jsfiddle.net/DvU63/2/

执行此

<script type='text/javascript'> 
    window.onload=function(){
    var text = document.getElementById('text')
    text.focus();
    window.onhashchange = function() {
        text.focus();
    }
  }
</script>

小提琴