当前位置 博文首页 > IT13333的博客:audio标签 监听音乐获取时间

    IT13333的博客:audio标签 监听音乐获取时间

    作者:[db:作者] 时间:2021-08-27 22:19

    //

    audio标签 监听音乐获取时间

    在这里插入图片描述

            watchMusicTime(){
                let _this = this;
                //监听播放时间
                let musicDom = document.getElementsByTagName('audio')[0];//获取Audio的DOM节点
                //使用事件监听方式捕捉事件
                musicDom.addEventListener("timeupdate",function(){//监听音频播放的实时时间事件
                    let timeDisplay;
                    //用秒数来显示当前播放进度
                    timeDisplay = Math.floor(musicDom.currentTime);//获取实时时间
                    // console.log(timeDisplay)
                       //持续时间    (歌曲长度)
                    console.log(target.duration)
                    //处理时间
                    //分钟
                    let minute = timeDisplay / 60;
                    let minutes = parseInt(minute);
                    if (minutes < 10) {
                        minutes = "0" + minutes;
                    }
                    //秒
                    let second = timeDisplay % 60;
                    let seconds = Math.round(second);
                    if (seconds < 10) {
                        seconds = "0" + seconds;
                    }
                    _this.$store.state.realMusicTime = minutes+":"+seconds;//将实时时间存储到vuex中
                    // console.log(_this.$store.state.realMusicTime);
                },false);
            },
    
    cs
    下一篇:没有了