溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

利用JavaScript怎么指定音頻audio定時(shí)播放

發(fā)布時(shí)間：2020-11-30 15:41:15 來源：億速云 閱讀：690 作者：Leah 欄目：開發(fā)技術(shù)

這期內(nèi)容當(dāng)中小編將會(huì)給大家?guī)碛嘘P(guān)利用JavaScript怎么指定音頻audio定時(shí)播放，文章內(nèi)容豐富且以專業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

獲取音頻時(shí)長：

function getAudioDuration(src) {
      let audio = document.createElement('audio') //生成一個(gè)audio元素 
      audio.src = src //音樂的路徑 
      audio.addEventListener("canplay", function () {
        console.log("音頻長度=>>>：", parseInt(audio.duration) + '秒', '音頻時(shí)分秒格式：', timeToMinute(parseInt(audio
          .duration)));
      });
    }

指定音頻audio在某個(gè)時(shí)間點(diǎn)進(jìn)行播放：

// 音頻加載完成后的一系列操作
    function duration() {
      var myVid = document.getElementById("videoDiv");
      console.log("duration ", myVid);
      if (myVid != null) {
        var duration;
        myVid.load(); //方法重新加載音頻/視頻元素
        // https://www.w3school.com.cn/tags/av_prop_currenttime.asp
        // currentTime 屬性設(shè)置或返回音頻/視頻播放的當(dāng)前位置（以秒計(jì)）。
        // 當(dāng)設(shè)置該屬性時(shí)，播放會(huì)跳躍到指定的位置。
        myVid.currentTime = 20; //默認(rèn)指定音頻默認(rèn)從20s的時(shí)候開始播放（默認(rèn)時(shí)間為s）
        myVid.oncanplay = function () {
          //duration 屬性返回當(dāng)前音頻的長度，以秒計(jì)。
          console.log("音頻時(shí)間", myVid.duration);
          console.log("時(shí)分秒格式轉(zhuǎn)化：", timeToMinute(myVid.duration))
        }
      }
    }

秒轉(zhuǎn)換時(shí)分鐘00:00:00時(shí)分秒格式：

function timeToMinute(times) {
      var t;
      if (times > -1) {
        var hour = Math.floor(times / 3600);
        var min = Math.floor(times / 60) % 60;
        var sec = times % 60;
        if (hour < 10) {
          t = '0' + hour + ":";
        } else {
          t = hour + ":";
        }

        if (min < 10) {
          t += "0";
        }
        t += min + ":";
        if (sec < 10) {
          t += "0";
        }
        t += sec.toFixed(2);
      }
      t = t.substring(0, t.length - 3);
      return t;
    }

00:00:00時(shí)分秒格式轉(zhuǎn)化為秒：

function timeEvent(e) {
      let time = e;
      var len = time.split(':');
      if (len.length == 3) {
        var hour = time.split(':')[0];
        var min = time.split(':')[1];
        var sec = time.split(':')[2];
        return Number(hour * 3600) + Number(min * 60) + Number(sec);
      }
      if (len.length == 2) {
        var min = time.split(':')[0];
        var sec = time.split(':')[1];
        return Number(min * 60) + Number(sec);
      }
      if (len.length == 1) {
        var sec = time.split(':')[0];
        return Number(sec);
      }
    }

完整代碼：

<!DOCTYPE html>
<html>

<head>

</head>

<body>
  <audio controls autoplay start="01:00" id='videoDiv'>
    <source src="http://mp3.9ku.com/hot/2005/05-19/65937.mp3" type="audio/ogg">
  </audio>

  <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
  <script type="text/javascript">
    $(function () {
      //js獲取某個(gè)mp3音頻文件的播放時(shí)長
      getAudioDuration('http://mp3.9ku.com/hot/2005/05-19/65937.mp3');

      duration();
      console.log("轉(zhuǎn)化為多少秒=》》", timeEvent("00:14:36"));
    })

    // 音頻加載完成后的一系列操作
    function duration() {
      var myVid = document.getElementById("videoDiv");
      console.log("duration ", myVid);
      if (myVid != null) {
        var duration;
        myVid.load(); //方法重新加載音頻/視頻元素
        // https://www.w3school.com.cn/tags/av_prop_currenttime.asp
        // currentTime 屬性設(shè)置或返回音頻/視頻播放的當(dāng)前位置（以秒計(jì)）。
        // 當(dāng)設(shè)置該屬性時(shí)，播放會(huì)跳躍到指定的位置。
        myVid.currentTime = 20; //默認(rèn)指定音頻默認(rèn)從20s的時(shí)候開始播放（默認(rèn)時(shí)間為s）
        myVid.oncanplay = function () {
          //duration 屬性返回當(dāng)前音頻的長度，以秒計(jì)。
          console.log("音頻時(shí)間", myVid.duration);
          console.log("時(shí)分秒格式轉(zhuǎn)化：", timeToMinute(myVid.duration))
        }
      }
    }

    function getAudioDuration(src) {
      let audio = document.createElement('audio') //生成一個(gè)audio元素 
      audio.src = src //音樂的路徑 
      audio.addEventListener("canplay", function () {
        console.log("音頻長度=>>>：", parseInt(audio.duration) + '秒', '音頻時(shí)分秒格式：', timeToMinute(parseInt(audio
          .duration)));
      });
    }

    // 秒轉(zhuǎn)換時(shí)分鐘00:00:00格式
    function timeToMinute(times) {
      var t;
      if (times > -1) {
        var hour = Math.floor(times / 3600);
        var min = Math.floor(times / 60) % 60;
        var sec = times % 60;
        if (hour < 10) {
          t = '0' + hour + ":";
        } else {
          t = hour + ":";
        }

        if (min < 10) {
          t += "0";
        }
        t += min + ":";
        if (sec < 10) {
          t += "0";
        }
        t += sec.toFixed(2);
      }
      t = t.substring(0, t.length - 3);
      return t;
    }

    // 00:00:00時(shí)分秒格式轉(zhuǎn)化為秒
    function timeEvent(e) {
      let time = e;
      var len = time.split(':');
      if (len.length == 3) {
        var hour = time.split(':')[0];
        var min = time.split(':')[1];
        var sec = time.split(':')[2];
        return Number(hour * 3600) + Number(min * 60) + Number(sec);
      }
      if (len.length == 2) {
        var min = time.split(':')[0];
        var sec = time.split(':')[1];
        return Number(min * 60) + Number(sec);
      }
      if (len.length == 1) {
        var sec = time.split(':')[0];
        return Number(sec);
      }
    }
  </script>
</body>

</html>

上述就是小編為大家分享的利用JavaScript怎么指定音頻audio定時(shí)播放了，如果剛好有類似的疑惑，不妨參照上述分析進(jìn)行理解。如果想知道更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場，如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手