js怎么做本地的视频文件的预览

JavaScript022

js怎么做本地的视频文件的预览,第1张

用这个方法：varWordApp=newActiveXObject("Word.Application")//注：IE的ActiveX安全性能放开才行WordApp.Application.visible=falsevarDoc=WordApp.documents.open(path)//对word的操作见office的MSDNWordApp.quit()

<input type="file" accept="video/*" onChange={this.previewVideo} />

<video id="myVideo" autoPlay width="300" />

使用FileReader读取转为Data URL：

previewVideo = (file) => {

    // 建议判断下视频大小及格式，太大的可能会有问题

    const reader = new FileReader()

    reader.onload = (evt) => {

      const myVideo = document.querySelector("#myVideo")

      myVideo.src = evt.target.result

    }

    reader.readAsDataURL(file)

}

网页中插入点视频开始显示图片,可以利用js代码来实现点击图片显示视频。具体代码如下:

<style>

.pic{clear:bothwidth:410pxheight:240px}/*图片区域*/

.pic img{width:410pxheight:240px}/*图片宽度和高度，可自行修改*/

.play{clear:bothwidth:410pxheight:240pxdisplay:none}/*视频区域-最初先设为隐藏*/

</style>

<div id="pic"><a href="JavaScript:vide()"><img src="图片.jpg"</a></div>

<div id="play"><embed src="视频文件.mp4" width="410" height="240" autostart="false"></embed></div>

<script>

function $(v){return document.getElementById(v)}

function view(id){$(id).style.display = "block"}

function hide(id){$(id).style.display = "none"}

function vide(){//点击图片显示视频

hide("pic")view("play")

}

</script>