javascript - 多个动态添加的 HTML 视频不静音

Question

我通过 jquery append（HTML 字符串）将一堆 html 视频添加到 dom

我希望它们被静音插入。

问题是，现在它们没有被静音，即使我用静音道具注入它们。

当我删除视频标签上的静音属性时，尝试类似的操作会使$('video').prop("muted",true);它们静音，但只有在它们全部加载之后。

我是否尝试以另一种方式添加视频，或者为 html 视频找到一个 onLoad 方法并在它们准备好时触发静音功能。

jsfiddle 追加后的样子：http: //jsfiddle.net/mvsMG/

Answer 1

尝试onloadeddataHTML5 事件处理程序：

$(document).ready(function(e) { //do NOT use $(window).load; it will not mute all videos
   // mute all the videos when data is loaded for each
   $('video').on('loadeddata', function(e) {
       //console.log('onloadeddata', e.target);
       $(this).prop('muted', true);
    }); 
});

这是演示小提琴。

注意：我不知道您正在使用哪个浏览器进行测试，但您应该查看HTML5 (和) 属性的浏览器支持列表。mutedloopautoplay