使用JavaScript实现获取audio时长

 更新时间:2024年04月10日 14:36:56   作者:码农新锐  
这篇文章主要为大家详细介绍了如何使用JavaScript实现获取audio时长,并且转换为分钟00:00:00格式,感兴趣的小伙伴可以跟随小编一起学习一下

写js时在网上找了很多获取音频时长都获取不到,然后搜索各种试最后终于可以,记录下来方便以后使用。

// 音频加载完成后的一系列操作
function duration(){
	var myVid = document.getElementById("videoDiv");
	console.log("duration  ",myVid);
	if(myVid != null){
	     var duration;
	     myVid.load();
	     myVid.oncanplay = function () {  
	            console.log("myVid.duration",myVid.duration);
				timeToMinute(myVid.duration)
	      }
	}
}
 
// 秒转换分钟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;
  
}

方法补充

除了上文的方法,小编还为大家整理了一些JavaScript获取audio时长的方法,希望对大家有所帮助

js获取html5 audio 音频时长方法

var myVid = $('#' + showImgId)[0];
                                if (myVid != null) {
                                    var duration;
                                    myVid.load();
                                    myVid.oncanplay = function () {
                                        console.log("myVid.duration", myVid.duration);
                                    }
                                }
var time = _audio.duration;
        //分钟
    var minute = time / 60;
    var minutes = parseInt(minute);
    if (minutes < 10) {
        minutes = "0" + minutes;
    }
    //秒
    var second = time % 60;
    var seconds = Math.round(second);
    if (seconds < 10) {
        seconds = "0" + seconds;
    }

js 获取audio时长

第一种

var myVid = document.getElementById("audio_duration");
console.log("duration  ",myVid);
if(myVid != null){
     var duration;
     myVid.load();
     myVid.oncanplay = function () {  
            console.log("myVid.duration",myVid.duration);
      }
}

第二种:这个有一点误差,因为我用都audio是一个列表

function getDuration() {
    setTimeout(function () {
    var duration = myVid.duration;
    if(isNaN(duration)){
    getDuration();
    }else{
        var _duration = transTime(myVid.duration);
        $(".audio_duration").html(_duration);
       console.info("时长:"+myVid.duration+"秒")
    }
    }, 10);
}

到此这篇关于使用JavaScript实现获取audio时长的文章就介绍到这了,更多相关JavaScript获取audio时长内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 编写高质量JavaScript代码的基本要点

    编写高质量JavaScript代码的基本要点

    编写高质量JavaScript代码的基本要点分享给大家,感兴趣的小伙伴们可以参考一下
    2016-03-03
  • JavaScript内存管理介绍

    JavaScript内存管理介绍

    这篇文章主要介绍了JavaScript内存管理介绍,本文讲解了内存生命周期、JavaScript的内存分配、通过函数调用的内存分配、当内存不再需要使用时释放等内容,需要的朋友可以参考下
    2015-03-03
  • javascript 传统事件模型构造的事件监听器实现代码

    javascript 传统事件模型构造的事件监听器实现代码

    最近做东西需要添加大量的事件,而且要对所有事件进行比较细致的控制,于是便试着写了个事件监听器。
    2010-05-05
  • 浅谈Webpack4 Tree Shaking 终极优化指南

    浅谈Webpack4 Tree Shaking 终极优化指南

    这篇文章主要介绍了浅谈Webpack4 Tree Shaking 终极优化指南,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-11-11
  • 小程序实现多个选项卡切换

    小程序实现多个选项卡切换

    这篇文章主要为大家详细介绍了小程序实现多个选项卡切换,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-06-06
  • 仿豆瓣分页原型(Javascript版)

    仿豆瓣分页原型(Javascript版)

    仿豆瓣分页原型(Javascript版)...
    2007-04-04
  • Javascript前端UI框架Kit使用指南之kitjs事件管理

    Javascript前端UI框架Kit使用指南之kitjs事件管理

    本文详细介绍了Kitjs的事件管理功能,包括普通的Dom事件、Kit如何解决问题、代码解析、注销事件等。需要的朋友可以参考下。
    2014-11-11
  • uniapp微信小程序使用xr加载模型的操作方法

    uniapp微信小程序使用xr加载模型的操作方法

    这篇文章主要介绍了uniapp微信小程序使用xr加载模型的操作方法,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧
    2024-07-07
  • JS highcharts动态柱状图原理及实现

    JS highcharts动态柱状图原理及实现

    这篇文章主要介绍了JS highcharts动态柱状图原理及实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-10-10
  • js正则校验特殊的不可见字符的具体实现

    js正则校验特殊的不可见字符的具体实现

    用户可能从Excel或者其他地方直接复制粘贴,这时候提交到后端会导致获取的用户输入中包含一些特殊的不可见字符,本文主要介绍了js正则校验特殊的不可见字符的具体实现,具有一定的参考价值,感兴趣的可以了解一下
    2024-06-06

最新评论