javascript 回调适用于 IE，但不适用于 Chrome 或 Firefox答案

【问题标题】：javascript callback works with IE, but not Chrome or Firefoxjavascript 回调适用于 IE，但不适用于 Chrome 或 Firefox
【发布时间】：2011-05-18 00:00:26
【问题描述】：

我认为这段代码应该播放声音，然后显示一个警告框。它适用于 IE9，但适用于 Chrome 和 Firefox，会播放声音，但从不调用回调 - 所以没有警告框。

我是一名 c#、c++ 程序员，不熟悉 javascript，我需要一些帮助！谢谢。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script type="text/javascript">
        var playAll= function(){
             var audio = document.getElementById('s');

             var callback = function(e){
                alert("ended"); 
             };

            audio.onended = callback;
            audio.play();
        }

    </script>
</head>

<body>
    <input name="Button1" type="button" value="Play" onclick="playAll()"/>

    <audio ID="s">
    <source src="s.mp3"  >
    <source src="s.ogg"  >
</body>

</html>

【问题讨论】：

标签： javascript html callback

【解决方案1】：

为了确定不是无效html的问题，请使用以下有效版本

<audio ID="s">
  <source src="s.mp3" />
  <source src="s.ogg" />
</audio>

然后用正确的方式绑定事件。

audio.addEventListener( "ended", callback, false);

【讨论】：

【解决方案2】：

onended 似乎是 IE9 特有的，Chrome 和 Firefox 会触发事件ended，你可以绑定一个函数来像这样：v.addEventListener("ended", function() { alert("ended"); }

请记住，HTML5 规范仍在开发中，并非所有浏览器都以相同的方式实现它。

这里有一个类似的问题：HTML 5 Video OnEnded Event not Firing

【讨论】：

谢谢！该代码适用于 IE 和 Chrome，但要使其适用于 Firefox，我必须添加“false”参数：audio.addEventListener("ended", function(e) { alert("ended"); },false );