javascript - HTML 视频无法在 Microsoft EDGE 中播放

Question

我的站点中有以下视频。这被设置为页面顶部的固定背景，包括主横幅。此元素在除 EDGE 之外的所有浏览器中都能正常播放。

我什至尝试编写一个自定义 javascript 片段来强制播放(使用按钮调用)。这在 Chrome 上测试时有效，但不适用于 EDGE。

var vid = document.querySelector('#bgvid');

function playVideo() {
    console.log('trying to play!')
    vid.play();
};

<video poster="http://cranneyhomeservices.com/wp-content/uploads/2017/05/HS_Loop_Frame.png" id="bgvid" playsinline autoplay muted loop>
  <source src="http://cranneyhomeservices.com/Cranney-website.mp4" type="video/mp4" media="all and (max-width:414px)">
</video>

Answer 1

根据我的评论，您应该使用 getElementById() 而不是 querySelector()。这应该被 chrome 和 edge 正确解释。

编辑:

在我的 Edge 中测试您的 fiddle 后，这是一个安全问题。这个问题已经在 SO 上讨论过:

HTTPS security is compromised error. How to fix?

确保您没有从非安全来源加载任何内容(即 https 而不是 http)