在AJAX页面加载后播放的HTML5video

当我通过AJAX请求到达页面时，我很难获得HTML5video。

如果您刷新页面，或直接登陆页面，它可以正常工作。 但是当通过AJAX导航到页面时，它无法播放。

代码是：

我尝试在AJAX页面加载成功时触发以下代码：

 video = document.getElementById('video'); video.load(); video.addEventListener('loadeddata', function() { video.play(); }, false); 

还简单地说：

 video = document.getElementById('video'); video.play(); 

我也尝试过使用像video.js这样的插件，但无济于事。

我不禁想到我错过了一些非常简单的事情。 当然，如果video在页面上并且具有自动播放设置，那么无论您是通过AJAX还是直接到达页面，它都应该播放？

对页面的AJAX请求只更新#main元素（video在里面）和history.pushState – 这可能与它有什么关系吗？ 它似乎不太可能……

Answer 1

对于那些在同一个问题上苦苦挣扎的人，我发现在ajax调用之后video的属性’暂停：true’甚至认为autoplay已设置，我在’loadeddata’上调用了video.play（）。

解决方案是在检测到暂停时触发video.play（）。 我还发现它在video上没有“自动播放”属性并且在多次初始化后变得不稳定时工作更顺畅。

DOM：

JS：

 video = jQuery('#video').get()[0]; video.addEventListener('loadeddata', function() { video.play(); }); video.addEventListener('pause', function() { video.play(); }); 

此外，对于任何想知道为什么我可能想要这种能力的人来说，它是在网页的背景上播放的video，因此用户无需播放/暂停它。

Answer 2

你可以在你的ajax调用之前调用video.play（）。 喜欢HTML

Answer 3

您的video代码没有ID。 如果您有两个标签怎么办？ 你要：

然后：

video = document.getElementById('blah');

Answer 4

可能这是一个语法错误，因为你似乎有一些PHP以'; ?>的forms泄漏到HTML中'; ?> '; ?>在poster和src属性的末尾。