Остановите воспроизведение видео iframe после закрытия модального окна - PullRequest
Новая
       67

Остановите воспроизведение видео iframe после закрытия модального окна

0 голосов
/ 27 марта 2020

Мне нужно остановить воспроизведение видео после закрытия модального окна. Это мой код: 

<div onclick="document.getElementById('id01').style.display='block'" class="mkdf-elements-holder-item-content mkdf-elements-holder-custom-184744" style="padding: 300px 0 200px 0">


  <div id="id01" class="w3-modal">
    <div class="w3-modal-content w3-card-4">
      <header style="background-color:white;" class="w3-container w3-teal"> 
        <span onclick="document.getElementById('id01').style.visibility='hidden'"
        class="w3-button w3-display-topright">&times;</span>
        <h2 style="background-color:white; color: white"> V </h2>
      </header>
      <div class="w3-container">
    <iframe id="ifr" src="https://www.youtube.com/embed/ZrXbX8cWrvQ" allowscriptaccess="always"> /iframe>
      </div>
    </div>
  </div>

Я пробовал этот код, но он не работает: 

<script>
 $("#id01").on('hidden.bs.modal', function (e) {
        $("#id03 iframe").attr("src", $("#id03 iframe").attr("src"));
    });
</script>

Кто-нибудь знает, как мне добиться остановки воспроизведения видео при закрытии модального окна

1 Ответ

0 голосов
/ 27 марта 2020

Как jQuery ссылаться и идентифицировать, который отсутствует в вашем HTML? #id03 не существует, как указано @Manjuboyz, вместо этого используйте #ifr для ссылки на ваш iframe. 

<script>
$("#id01").on('hidden.bs.modal', function (e) {
  $("#ifr").attr("src", $("#ifr").attr("src"));
});
</script>

Ваш подход потребует перезагрузки всего видео. Если у вас есть iframe, который содержит элемент <video></video>, вы можете просто остановить его и установить его в начало: 

$('#ifr').contents().find('video').each(function () {
 this.currentTime = 0; // set to beginning
 this.pause(); // set video to paused
});

Вам нужно использовать jQuery contents() для работы с DOM iframe.

...