如何在jQuery中获取视频高度？代码获取的_height始终为0求解决

嘿，我来帮你搞定这个问题！你遇到的videoHeight一直返回0的情况，主要有两个核心原因，咱们一步步来解决：

问题1：视频元数据未加载就读取高度 #

你当前的代码是在视频元素刚创建完成时，立刻去获取videoHeight——但这时候浏览器还没加载完视频的元数据（包括分辨率、时长这类关键信息），自然没法返回正确的高度，所以只能得到0。

问题2：你的源文件是图片而非视频 #

看你的代码里，src指向的是一张.jpg图片！视频元素无法把图片解析成视频内容，这也会导致完全拿不到有效的视频高度，你得把路径换成真正的MP4视频文件才行。

修正后的代码示例 #

下面是调整后的代码，通过监听loadedmetadata事件，确保在视频元数据加载完成后再获取高度：

// 重要：替换成你真实的MP4视频文件路径
var path = "http://localhost:49634/Uploads/YourActualVideoFile.mp4"; 
var video = $('<video />', { 
    id: 'videoddd', 
    src: path, 
    type: 'video/mp4' 
});

// 监听视频元数据加载完成的事件
video.on('loadedmetadata', function() {
    // 此时视频的尺寸信息已经完全可用
    var _height = this.videoHeight;
    alert(_height);
});

// 可选：如果部分浏览器存在加载问题，可以先把视频添加到DOM中
// $('body').append(video);

关键细节说明 #

• loadedmetadata事件：这是浏览器通知你视频元数据加载完成的信号，此时读取videoHeight/videoWidth才会得到正确值。
• 视频源有效性：必须确保src指向浏览器支持的视频格式（比如MP4），无效路径或非视频文件都会导致加载失败。
• DOM关联：少数浏览器要求视频元素必须加入DOM树才能加载元数据，如果上面的代码还是不行，试试先执行$('body').append(video)再监听事件。

内容的提问来源于stack exchange，提问作者saveesh p m