Question

当我打开#myModal模式出现且我的视频可播放时，当我点击我的#myModal2时，模式会出现，但视频未显示...

我错过了什么？

<div class="list-group">
    <h3 class="bg-ownmade paddingAll removeMargin">
        <span class="fa fa-book" aria-hidden="true"></span> Webbhistoria
    </h3>
    <a href="#" class="list-group-item" data-toggle="modal" data-target="#myModal" 
        data-keyboard="true"><span class="fa fa-film"></span> ABC</a>
    <!-- Modal -->
    <div class="modal fade" id="myModal" role="dialog" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                         &times;</button>
                    <h4 class="modal-title">Instruktionsvideo om...</h4>
                </div>
                <div class="modal-body">
                    <iframe width="100%" height="500px" 
                        src="https://www.youtube.com/embed/db-7J5OaSag" 
                        frameborder="0" allowfullscreen></iframe>
                    <p>Bla bla bla</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" 
                        data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
    <a href="#" class="list-group-item" data-toggle="modal" 
        data-target="#myModal2" data-keyboard="true">
            <span class="fa fa-film"></span> ABC
    </a>
    <!-- Modal -->
    <div class="modal fade" id="myModal2" role="dialog" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" 
                        data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Instruktionsvideo om...</h4>
                </div>
                <div class="modal-body">
                    <iframe width="100%" height="500px" 
                        src="https://www.youtube.com/watch?v=IsXEVQRaTX8" 
                        frameborder="0" allowfullscreen></iframe>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" 
                        data-dismiss="modal">Close</button>
                </div>
            </div>

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

Answer 1

变化：

src="https://www.youtube.com/watch?v=IsXEVQRaTX8"

要：

src="https://www.youtube.com/embed/IsXEVQRaTX8"

出于安全原因拒绝请求：

拒绝在一个框架中显示“https://www.youtube.com/watch?v=IsXEVQRaTX8”，因为它将“X-Frame-Options”设置为“SAMEORIGIN”。

使用YouTube's Embed URL

拒绝在iframe中显示youtube视频

1 个答案: