Как выключить видео с youtube при закрытии модального окна?

Question

[Vicavic]

Приветствую,

на странице есть несколько модальных окон с видео.

<div class="row">
                                        	<div class="col-md-4">
                                        		<div data-toggle="modal" data-target="#myModal" class="slide-block" style="background-image: url('./assets/img/header-2.jpg');">
                                        			Title
                                        		</div>
                                        	</div>
                                        	<div class="col-md-4">
                                        		<div data-toggle="modal" data-target="#myModal" class="slide-block" style="background-image: url('./assets/img/header-2.jpg');">
                                        			Title
                                        		</div>
                                        	</div>
                                        	<div class="col-md-4">
                                        		<div data-toggle="modal" data-target="#myModal" class="slide-block" style="background-image: url('./assets/img/header-2.jpg');">
                                        			Title
                                        		</div>
                                        	</div>
                                        </div>
                                    </div>

Вот модальное окно

<div id="myModal" class="modal fade" role="dialog">
																	<div class="modal-dialog">
																		<div class="modal-content">
																			<button type="button" class="close" data-dismiss="modal">&times;</button>
																			<div class="modal-body">
																				<div class="embed-responsive embed-responsive-16by9">
																					<iframe class="embed-responsive-item" src="url" frameborder="0" allowfullscreen></iframe>
																				</div>
																			</div>
																		</div>
																	</div>
																</div>

Вот останавливает видео при закрытии окна.

jQuery(document).ready(function(){
																		var youtube_src = jQuery("#myModal iframe").attr("src");
																		jQuery("#myModal").on('hidden.bs.modal', function (e) {
																			jQuery("#myModal iframe").attr("src", null);
																		});
																	});

Проблема в том, что окон много. То есть, если открыть следующие видео, то чуда не произойдет. Так не работает - jQuery("#myModal1 iframe"), jQuery("#myModal2 iframe"), и так jQuery("#myModal, myModal1 iframe")

Comments

[Сергей delphinpro]

jQuery("#myModal iframe").attr("src", null);

Ужас... Почему iframe api не используете?

[Сергей delphinpro]

и так jQuery("#myModal, myModal1 iframe")

вот так:
jQuery("#myModal iframe, myModal1 iframe")

но лучше
jQuery(".modal iframe')

а еще лучше всё-таки воспользоваться программным интерфейсом, а не костылями

[Vicavic]

Сергей, Неа, так не работает(

Если использовать .modal, то при запуске следующего видео, запускается предыдущие.

[Сергей delphinpro]

Vicavic, я о закрытии писал, а не о запуске...

[Vicavic]

Сергей, Да, но какой смысл в других окнах, если там не возможно воспроизвести видео?)

Если так

jQuery(document).ready(function(){
																	//часть предыдущего кода для воспроизведения видео в модальном окне
																	jQuery(".modal").on('hidden.bs.modal', function (e) {
																		jQuery(".modal iframe").attr("src", null);
																	});
																});

то при при открытии следующего окна (с другим видео) ничего не происходит.

[Сергей delphinpro]

Vicavic, а что должно произойти?

Блин, проще кусок кода дать, похоже...

<div id="myModal1" class="modal fade" role="dialog" data-video="https://youtube.com/...">
  ...
  <iframe frameborder="0" allowfullscreen></iframe>
  ...
</div>

<div id="myModal2" class="modal fade" role="dialog" data-video="https://youtube.com/...">
  ...
  <iframe frameborder="0" allowfullscreen></iframe>
  ...
</div>

$('.modal').on('show.bs.modal', function(){
  var videoLink = this.dataset['video'];
  var $iframe = $('iframe', this);
  $iframe.attr('src', videoLink);
});

$('.modal').on('hide.bs.modal', function(){
  var $iframe = $('iframe', this);
  $iframe.attr('src', null);
});

[Vicavic]

Сергей, Спасибо