javascript – “DomContentLoaded”在我的浏览器中不起作用?

我写了这样的html页面:

<div>
    <img src="Natural1.jpg" id="img1" >
 <audio src="sound.mp3" id="audio1" ></audio>
</div>

我的javascript文件是这样的:

function init(){
    audio1 = document.getElementById("audio1");
    var img1 = document.getElementById("img1");
    img1.addEventListener("click", imgClick, false);
}
function imgClick(){
    if(audio1.paused){
        audio1.play();
    }
    else{
        audio1.pause();
    }
}
document.addEventListener('DomContentLoaded', init, false);

我在chrome12中运行它,脚本首先执行document.addEventListener方法,但它没有进入init方法,为什么?
我在IE8中尝试使用attachEvent方法而不是addEventListener,但它仍然没有.
 我的代码出了什么问题?

解决方法:

可能是事件名称的大写.请尝试以下方法:

document.addEventListener('DOMContentLoaded', init, false);

很确定这是事实.我测试了以下内容:

document.addEventListener("DomContentLoaded", function(){ alert('Dom') }, false);
document.addEventListener("DOMContentLoaded", function(){ alert('DOM') }, false);

在jsbin上,后一个事件是独自提出的.请注意,IE8不会引发此警报,因为此事件不会发生.相反,你会从IE9 and IE10找到成功.

示例:http://jsbin.com/ocidok/edit#javascript,html

对DOMContentLoaded的浏览器支持在Mozilla Developer Network上编目.截至今天,此事件仅在以下浏览器中可用:

上一篇:javascript – addEventListener来更改一个类中所选id的CSS样式


下一篇:javascript – 如何通过JQuery触发JS native,甚至addEventListener(“change”,function)