参照：https：//stackoverflow.com/questions/19355952/make-html5-video-stop-at-indicated-time
<html>
<head></head>
<body>
<button onclick="setCurEndTimeAndPlay(5,11.48)" type="button">点击播放</button>
<br>
<br>
<audio id="audio1" controls="controls"><source src="D1T02 - Wuthering Heights.mp3"></audio>
<script>
myAud=document.getElementById("audio1");
function setCurEndTimeAndPlay(startTime,endTime){
// 设置当前时间
myAud.currentTime=startTime;
// 设置暂停时间
// var endTime = 11.48;
myAud.addEventListener('timeupdate', function () {
if(myAud.currentTime>endTime){
myAud.pause();
}
}, false);
myAud.addEventListener('loadedmetadata', function () {
myAud.play();
}, false);
// 播放
myAud.play()
}
</script>
</body></html>
2.2。
<html>
<head></head>
<body>
<audio id="audio1" controls="controls"><source src="D1T02 - Wuthering Heights.mp3"></audio>
<br/><br/>
<button onclick="setCurEndTimeAndPlay(0.08,3.16)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(3.16,11.48)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(11.48,14.04)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(14.04,20.52)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(20.52,23.08)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(23.08,28.16)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(28.16,29.72)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(29.72,37.96)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(37.96,45.32)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(45.32,47.4)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(47.4,49.56)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(49.56,52.44)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(52.44,63.32)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(63.32,66.0)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(66.0,68.92)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(68.92,75.36)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(75.36,81.68)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(81.68,86.52)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(86.52,91.12)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(91.12,97.4)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(97.4,106.56)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(106.56,108.2)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(108.2,113.28)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(113.28,120.04)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(120.04,125.84)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(125.84,132.28)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(132.28,139.24)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(139.24,151.8)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(151.8,155.96)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(155.96,165.24)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(165.24,170.04)" type="button">点击播放</button>
<button onclick="setCurEndTimeAndPlay(170.04,184.72)" type="button">点击播放</button>
<script>
// https://stackoverflow.com/questions/19355952/make-html5-video-stop-at-indicated-time
var myAud=document.getElementById("audio1");
function setCurEndTimeAndPlay(startTime,endTime){
// 设置当前时间
myAud.currentTime=startTime;
var pausing_function = function(){
// 播放
myAud.play();
if(myAud.currentTime >= endTime) {
myAud.pause();
// remove the event listener after you paused the playback
myAud.removeEventListener("timeupdate",pausing_function);
}
};
myAud.addEventListener("timeupdate", pausing_function);
}
</script>
</body></html>