在输入标记上使用autofocus属性时,不会调用onfocus

Question

在以下示例中,我只获得一个警告框.我读到焦点是在JavaScript代码执行之前.有没有办法让这个工作？

<input id="i" type="text" autofocus onfocus="alert(1)">

<script type="text/javascript">
document.getElementById('i').addEventListener('focus', function() {
    alert(2);
}, false);
</script>

(我只在Safari中测试过这个)

编辑:我显然可以这样做(Prototypejs选择器):

var autofocusElement = $$('input[autofocus]')[0];
callListener(autofocusElement);

但与仅添加事件监听器相比,它看起来很丑陋.

编辑:

不要担心自动聚焦属性缺乏浏览器支持.它很容易解决,就像我在下面的链接中所做的那样.我可以看到,这个问题也是最好的解决方案.我的问题是,如果我能够比不必手动调用监听器那么难看.

http://jsfiddle.net/tellnes/7TMBJ/3/

它在Firefox 3.6中运行良好,因为Firefox不支持自动对焦.但是在支持自动对焦的Safari中,并不是所谓的事件.

Answer 1

从HTML5工作草案:

autofocus指定属性的文档中不得有多个元素 .

所以你无论如何都要求未定义的行为.

autofocus在Firefox 3.6下只有一个元素,在页面加载时都不会调用这两个处理程序.手动将焦点放在元素上会调用两个处理程序(然后进入无限循环,因为警报框在关闭时将焦点返回给元素).

HTML5草案确实说autofocus应该在页面加载上执行聚焦步骤,包括提升focus事件,但是浏览器当前没有以完整或一致的方式实现该功能.

您可能希望focus在页面加载期间显式调用事件处理程序,直到HTML5规范完成并且浏览器开始瞄准完全支持.