bootstrap模式中的视频事件

时间:2016-09-08 09:41:34

标签: javascript twitter-bootstrap-3 html5-video html5-audio

当显示引导模式时,我们可以触发HTML5音频/视频事件吗?

示例:

$(".abc").on("shown.bs.modal", function(){
         $("video")[0].oncanplay = function(){
            alert("canplay");
         };
    });

1 个答案:

答案 0 :(得分:0)

这对我自己有用......

在js文件中

$(function() {
    $('#videoModal').on('shown.bs.modal', function(e) {
        var src = $('#videowrapper').attr('data-iframe-src');
        $('#videowrapper').attr('src', src)
    });
    $('#videoModal').on('hidden.bs.modal', function(e) {
        $('#videowrapper').attr('src', '')
    })
});

在模态内容区

<div class='embed-container'>
                        <iframe allowfullscreen data-iframe-src='[YOUTUBE URL]?autoplay=1&controls=0&showinfo=0&modestbranding=1&rel=0' frameborder='0' id="videowrapper" name="videowrapper" src=""></iframe>
                    </div>