使用jQuery确定video文件大小
我正在使用videojs播放各种尺寸的html5video。 是否可以使用jQuery（或其他脚本语言）检测video文件的高度/宽度，以便我可以动态地将这些输入到嵌入代码中？
谢谢！
我担心这不太可能。 为了使浏览器能够确定video的大小，必须先加载它。
一种解决方案可能是，假设这甚至可以工作，首先加载video而不指定高度和宽度，但使用CSS隐藏video，计算尺寸，销毁video并使用正确的尺寸再次加载它。 这将是非常低效的。
或者，您可以创建一个服务器端脚本（PHP / ASP / …）来读取video文件，检测最初保存内容时的高度和宽度，并将高度和宽度保存到数据库中。 然后，您可以在每个页面视图上从数据库中读取高度和宽度。 虽然你可以让这样的脚本在每个请求上读取video文件，但这将是低效的并且会增加生成页面所需的时间。
如果您使用的是PHP，我强烈建议您查看ffmpeg-php ，这是一个免费的开源库，可用于解析几种类型的video文件。
另一个想法：另一个解决方案可能是不在嵌入代码中指定高度和宽度，并让浏览器自己调整video大小。 然后，您可以调整灯箱的大小以修复video容器。 许多灯箱插件都有可以挂钩的事件。
由于video大小在文件的元数据中，我认为您只能在服务器上访问它。 流式video本身并不是完整的文件，并且不会带有任何元数据。
所以，我建议你一个简单的解决方案（好吧，实际上是一种解决方法）：在加载video之前做一个$.ajax请求。 您的服务器将收到此请求，并根据它可以访问的元数据返回大小。 然后，在你的ajax sucess回调中，你将能够调整容器height ，最后显示video。
此外，重要的是要记住，只要有人正在观看video，就无法访问文件来读取元数据。 所以它真的希望你正确配置ajax响应的caching 。
是的，您可以获取videoWidth和videoHeight属性 – 它们随video的元数据一起下载，因此请确保不要对video元素使用preload =“none”，因为它会阻止元数据下载，直到有人尝试播放video。 以下是使用jquery的方法：
$(function(){ $('video').bind('loadedmetadata', function(){ var rawWidth = $(this).prop('videoWidth'); var rawHeight = $(this).prop('videoHeight'); }); });
您可以使用height属性获取video的高度（如果它在元素上设置…
$('#idOfVideoElement').attr('height');