Question

我有以下代码，并希望在页面加载时打开模式。由于常规的onload功能无法正常工作，因此我在触发点击时尝试了此功能。但这也不会自动播放视频，而当我手动单击span时会自动播放视频。

知道为什么吗？

<div id="videoModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="videoModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-body">
        <iframe frameborder="0" allowfullscreen id="video" class="video" src="" data-video="https://www.youtube.com/embed/kLKOO_-MYKg?modestbranding=0&rel=0&controls=0&showinfo=0&html5=1"></iframe>
        <script>
          $(document).ready(function() {
            var videoSrc = $("#video").data('video');
            $("#videoModal").on('hidden.bs.modal', function () {
              $("#videoModal iframe").attr('src', '');
            });
            $("#videoModal").on('show.bs.modal', function () {
              $("#video").attr("src", videoSrc+"&autoplay=1");
            });
            setTimeout(function(){
              $("#launch").click(); // this does not auto play the video
            }, 200);
          });
        </script>
      </div>
    </div>
  </div>
</div>
<!-- manually clicking this will launch the modal and auto play the video --> 
<span id="launch" data-toggle="modal" data-target="#videoModal">click</span>

Answer 1

找到了解决方案：只需将allow="autoplay"添加到iframe中就可以了

触发点击不会以模态自动播放YouTube视频

1 个答案: