Bootstrap: Wie man Video stoppt, nachdem das Modal geschlossen wurde

Question

Ich benutze bootstrap modales Fenster, um die Videos anzuzeigen, aber wenn ich das Video schließe, hört es nicht auf zu spielen. dh es spielt immer noch im Hintergrund. Wie kann ich das Abspielen des Videos zu stoppen, wenn die modale

Hier geschlossen ist mein Code unten:

 <ul class="fa-ul"> 
         <li><i class="fa fa-video-camera" aria-hidden="true"></i><a href="#" data-toggle="modal" data-target=".video1"> Video 1</a></li> 
    <li><i class="fa fa-video-camera" aria-hidden="true"></i><a href="#" data-toggle="modal" data-target=".video2"> Video 2</a></li> 

        </ul> 



<!---Modal1 --> 
     <div class="modal fade video1" id="advSearchModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
     <div class="modal-dialog modal-lg" role="document"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title" id="exampleModalLabel">Video 5</h4> 
      </div> 
      <div class="modal-body"> 

       <div class="row"> 
    <div class="bs-example" data-example-id="responsive-embed-16by9-iframe-youtube"> <div class="embed-responsive embed-responsive-16by9"> <video controls class="embed-responsive-item" src="videos/Chapters/Chapter%205.mp4" allowfullscreen=""></video> </div> </div> 

       </div> 

      </div> 
      <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      <!-- <button type="button" class="btn btn-primary">Send message</button> --> 
      </div> 
     </div> 
     </div> 
    </div> 


Modal 2 



    <!-- Modal --> 
    <div class="modal fade video2" id="advSearchModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
    <div class="modal-dialog modal-lg" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title" id="exampleModalLabel">Video 1</h4> 
     </div> 
     <div class="modal-body"> 

      <div class="row"> 
       <div class="bs-example" data-example-id="responsive-embed-16by9-iframe-youtube"> 
        <div class="embed-responsive embed-responsive-16by9"> 
         <video class="embed-responsive-item" controls src="/videos/Chapters/Chapter%201.mp4" allowfullscreen=""> 
         </video> 
        </div> 
       </div> 

      </div> 

     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <!-- <button type="button" class="btn btn-primary">Send message</button> --> 
     </div> 
    </div> 
    </div> 
</div> 


    <!-- End Modal --> 

Answer 1

diese

Versuchen:

<script> 
jQuery('#advSearchModal').on('hidden.bs.modal', function (e) { 
    // do something... 
    jQuery('#advSearchModal video').attr("src", jQuery("#advSearchModal video").attr("src")); 
}); 
</script> 

Quelle: https://coolestguidesontheplanet.com/stop-video-playing-bootstrap-modal-closed/