javascript - 视频未显示在 Bootstrap 模式中

Question

视频标签作为模态内容存在于 Bootstrap 模式中。我可以听到视频标签的音频，但它不可见。当我将视频标签附加到其他元素(例如正文)时，它会正确显示在那里。

<div class="modal fade" tabindex="-1" id="video_call_modal" role="dialog" aria-labelledby="Sign up view" data-backdrop="" aria-hidden="true" data-keyboard="false">
            <div class="modal-dialog ">
                <div class="modal-content">

                    <video autoplay id="chat_video"></video>

                </div>
            </div>
        </div>

JavaScript 内部

     $("#chat_video").attr("src",window.URL.createObjectURL(Stream))
     $("#video_call_modal").modal({keyboard:false})
      $("#video_call_modal").modal('show')

Answer 1

也许使用 Bootstrap 的 modal shown callback加载视频。我猜它在具有尺寸之前就已经调整到模态的大小了。

$('#video_call_modal').on('shown.bs.modal', function() {
    $("#chat_video").attr("src",window.URL.createObjectURL(Stream));
});

看在皮特的份上，请在这些语句上加上分号! :-)