3

我有以下代码。

<!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/

为什么页面加载时焦点不在textarea框上？单击链接时，焦点确实转到 textarea 框，但我也希望焦点转到页面加载时的 textarea 框。为什么不发生？

注意：我知道 textarea 的 HTML5 autofocus 属性。但是这个问题是关于为什么上面的 JavaScript 代码没有做我打算做的事情。

4

2 回答 2

5

您正在.focus()从处理程序内部执行语句，该onload处理程序本身在onload处理程序内部定义。这个内部onload不会被调用，因为当你定义它时，onload事件已经发生了。尝试这个：

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

  window.onhashchange = function() {
    text.focus()
  }
}

你的演示，更新：http: //jsfiddle.net/DvU63/2/

于 2013-09-01T07:30:32.443 回答
1

做这个

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

    text.focus();

    window.onhashchange = function() {
        text.focus();
    }
  }
</script>

小提琴

于 2013-09-01T07:32:54.160 回答