asp.net - 如何清除模式弹出窗口中iframe标签的多个YouTube网址？

Question

我有一个模态弹出窗口，用于显示youtube视频。即使关闭了模式弹出窗口，我仍面临的问题是视频正在播放。我已经清除了模式隐藏的网址。但是它只清除一个URL。剩余网址未清除。请帮忙。

$(document).ready(function() {
      /* Get iframe src attribute value i.e. YouTube video url
      and store it in a variable */
      var url = $("#cartoonVideo").attr('src');

      /* Assign empty url value to the iframe src attribute when
      modal hide, which stop the video playing */
      $("#myModal").on('hide.bs.modal', function() {
            $("#cartoonVideo").attr('src', '');
      });

      /* Assign the initially stored url back to the iframe src
      attribute when modal is displayed again */
      $("#myModal").on('show.bs.modal', function() {
           $("#cartoonVideo").attr('src', url);
      });

  });

Answer 1

@Sachin，
假设您已创建多个模态并添加相同的类，则需要将公用类设置为模态。

我认为您正在按照以下演示HTML进行工作。

    Like Eg.
    <!-- Modal -->
<div id="myModal1" class="modal fade" role="dialog">
  <div class="modal-dialog">   

  </div>
</div>
<!-- Modal -->
<div id="myModal2" class="modal fade" role="dialog">
  <div class="modal-dialog">   

  </div>
</div>
<!-- Modal -->
<div id="myModal3" class="modal fade" role="dialog">
  <div class="modal-dialog">   

  </div>
</div>

您需要设置一个通用类

并设置* iframe标签(通用类)。

    <!-- Modal -->
<div id="myModal1" class="modal fade jsyoutube" role="dialog">
  <div class="modal-dialog">   
    <iframe src="URL" class="jsframe"></iframe>
  </div>
</div>
<!-- Modal -->
<div id="myModal2" class="modal fade jsyoutube"  role="dialog">
  <div class="modal-dialog">   
<iframe src="URL" class="jsframe"></iframe>
  </div>
</div>
<!-- Modal -->
<div id="myModal3" class="modal fade jsyoutube" role="dialog">
  <div class="modal-dialog">   
<iframe src="URL" class="jsframe"></iframe>
  </div>
</div>

JavaScript脚本

    $(document).ready(function() {     
      $(".jsyoutube").on('hide.bs.modal', function() {
            $(".jsframe").attr('src', '');
      });
  });