笔记

万物寻其根，通其堵，便能解其困。
  博客园  :: 新随笔  :: 管理

audio 音频

Posted on 2024-07-22 19:29  草妖  阅读(4)  评论(0)    收藏  举报

原生audio

<!DOCTYPE html>
<html>
<head>
    <title>测试</title>
</head>
<body>
    <!-- video视频控件：
        autoplay：是否自动播放，值：autoplay。
        controls：是否显示播放控件，值：controls。
        loop：是否循环播放，值：loop
        src：视频路径。
     -->
    <audio autoplay="autoplay" controls="controls'"loop="loop" src="file://D:/测试材料/1.mp3"></audio>
</body>
</html>

 script

var trainaudio = document.getElementById("train_audio");
if (!iscontinue) {
    trainaudio.src = this.cs_url;
}
if (!trainaudio.duration) {
    trainaudio.onerror = function () {
          // 音频错误处理
          trainaudio.pause();
　　　　　　alert('音频资源加载错误');
    };
}
else {
    trainaudio.play();  // 播放
    trainaudio.volume = this.volume / 100;  // 设置音量
    trainaudio.oncanplay = function () {};
    trainaudio.onended = function () {};
    trainaudio.onerror = function () {
        // 音频错误处理
        trainaudio.pause();
    };
}
/**

在视频或音频加载过程中，事件的触发顺序如下：

  1. ‌onloadstart‌：开始加载媒体资源时触发。
  2. ‌ondurationchange‌：媒体资源的持续时间发生变化时触发。
  3. ‌onloadedmetadata‌：元数据加载完成时触发。
  4. ‌onloadeddata‌：初始数据加载完成时触发。
  5. ‌onprogress‌：媒体资源下载过程中周期性触发。
  6. ‌oncanplay‌：可以开始播放时触发。
  7. ‌oncanplaythrough‌：可以流畅播放时触发，无需缓冲‌1。

*/