在提交表单之前显示video

我想允许用户在我的网站上传video,我想在提交表单之前显示video的预览。

我用图像做了,但video的脚本不起作用

HTML:

 

预览的div:

 

PHP:

 $("#upload-vid1").on("change", function(){ var this_ = $(this).parent(); var dataid = $(this).attr('data-id'); var files = !!this.files ? this.files : []; if (!files.length || !window.FileReader) return; if (/^video/.test( files[0].type)){ var reader = new FileReader(); reader.readAsDataURL(files[0]); reader.onloadend = function(){ var video = document.getElementById('vid-src'); video.src = this.result; $("#vid1").show(); } } }); 

好的,所以你想在上传video之前向人们展示他们选择的内容。

由于您最近在此发布的post,以及您同时实施的要求。 完整代码如下。

HTML和JavaScript代码

 (function Preview_Video() { 'use strict' var URL = window.URL || window.webkitURL var Play_Video = function (event) { var file = this.files[0] var type = file.type var videoNode = document.querySelector('video') var fileURL = URL.createObjectURL(file) videoNode.src = fileURL } var inputNode = document.querySelector('input') inputNode.addEventListener('change', Play_Video, false) })()