elevideoaddEventListener('loadedmetadata', function () {
//加载数据 //视频的总长度 consolelog(elevideoduration);
})
elevideoaddEventListener('play', function () {
//播放开始执行的函数 consolelog("开始播放");
})
elevideoaddEventListener('playing', function () {
//播放中 consolelog("播放中");
})
elevideoaddEventListener('waiting', function () {
//加载 consolelog("加载中");
})
elevideoaddEventListener('pause', function () {
//暂停开始执行的函数 consolelog("暂停播放");
})
elevideoaddEventListener('ended', function(){
//结束 consolelog("播放结束");
}, false)
var hour = Mathfloor (video1duration / 3600);
var other = video1duration % 3600;
var minute = Mathfloor (other / 60);
var second = (other % 60)toFixed (2);
documentgetElementById ('duration')innerHTML = hour + '时' + minute + '分' + second + '秒';
>
可以通过 Nativejs 实现，通过设置 androidintentextradurationLimit 来限定录像时间。
<button id="btn" type="button" class="mui-btn mui-btn-blue mui-btn-block">按钮</button><script type="text/javascript">
documentquerySelector('#btn')addEventListener('click',function () {
// 调用原生android摄像头
var VIDEOZOOM = 200;
var MediaStore = plusandroidimportClass("androidproviderMediaStore");
var Intent = plusandroidimportClass("androidcontentIntent");
// 导入后可以使用new方法创建类的示例对象
var intent = new Intent("androidmediaactionVIDEO_CAPTURE");
intentputExtra("androidintentextravideoQuality", 1);//0 means low quality, 1 means high quality
//intentputExtra("androidproviderMediaStoreEXTRA_OUTPUT", url);
intentputExtra("androidintentextradurationLimit", 3);//设置录像时间
var main = plusandroidruntimeMainActivity();
mainstartActivityForResult(intent,VIDEOZOOM);
//获取返回参数
mainonActivityResult = function(requestCode, resultCode, data) {
var context = main;
plusandroidimportClass(data);
var uri = datagetData();
var resolver = contextgetContentResolver();
plusandroidimportClass(resolver);
var cursor = resolverquery(uri, null, null, null, null);
plusandroidimportClass(cursor);
cursormoveToFirst();
var column = cursorgetColumnIndexOrThrow(MediaStoreVideoMediaDATA);
// 获取录制的视频路径
var filePath = cursorgetString(column);
// 解析视频文件的属性
plusioresolveLocalFileSystemURL(filePath,function(entry) {
entryfile(function(file){
consolelog("size=="+filesize);
consolelog("name=="+filename);
});
}, function (e) {
consolelog("Resolve file URL failed: " + emessage);
});
};
})</script>
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1111minjs">
</script>
<script>
$(document)ready(function(){
$("video")[0]addEventListener("loadedmetadata", function(){
var tol = thisduration;//获取总时长
alert(tol);
});
});
</script>
</head>
<body>
<video src="/i/movieogg" controls="controls">
your browser does not support the video tag
</video>
</body>
</html>
1、首先需要新建一个html文件，命名为testhtml，用于介绍如何使用JS控制video视频的src。
2、在testhtml页面，使用button标签创建四个按钮，分别是播放/暂停、大、中、小，用于控制视频的播放效果。同时，使用video标签创建一个视频。
3、给每个按钮绑定onclick点击事件，当按钮被点击时，分别执行相应的函数来控制视频的播放效果。
4、使用documentgetElementById()获得视频对象，创建“播放/暂停”的playPause()函数，使用play()方法控制视频的播放，使用pause()控制视频的暂停。
5、创建makeBig（）函数，当点击"大"按钮时，使视频以宽度560px来播放视频。
6、创建makeNormal()函数与makeSmall()函数，当点击“中”按钮时，使视频以宽度420px来播放视频，当点击“小”按钮时，使视频以宽度320px来播放视频。
7、在浏览器打开testhtml文件，测试js控制视频播放的效果无误。
以上就是关于JS video视频标签的相关 *** 作全部的内容，包括:JS video视频标签的相关 *** 作、JS 如何把 duration 秒 转为 时分秒显示 currentTime、js方法如何获取视频当前播放的帧数等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）