代码之家 › 专栏 › 技术社区 › Marco

如何在动态创建时检测音频文件的结尾?

html5-audio jquery javascript

Marco · 技术社区 · 7 年前

我使用jQuery创建了一个音频对象,如下所示

var player;

$(document).ready(function() {
    player = new Audio();
    player.id = "player";
    player.volume = 0.5;
});

我可以玩,暂停,。。。成功地

player.src = file;
player.play();

这就是我遇到麻烦的时候。我试图检测球员何时停止比赛,但它不起作用。。。

我尝试了以下方法,但没有成功:

$(document).on("ended", "#player", function(e) {
    alert('stop');
});

$("#player").bind("ended", function() {
    alert('stop');
});

$("#player").on("ended", function(e) {
    alert('stop');
});

我如何判断玩家何时停止使用jQUERY?

2 回复 | 直到 7 年前

Pedram Neo M Hacker 7 年前

为什么不使用 html5 纯音频元素 js ?

W3Schools

var aud = document.getElementById("myAudio");
aud.onended = function() {
    alert("The audio has ended");
};

Pedram Neo M Hacker 7 年前

你离得很近,但应该使用 addEventListener 对于 ended event

$(document).ready(function() {
    player = new Audio();
    player.volume = 0.5;
    var playerID = document.getElementById('player');
    
playerID.addEventListener("ended", function(e){
  alert('ended');
}, false);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<audio controls id="player">
  <source src="https://www.w3schools.com/html/horse.ogg" type="audio/ogg">
  <source src="https://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

_{W3学校的音频学分}