Halte das Abspielen von Youtube auf, wenn Modal geschlossen ist - jquery, youtube, modal-dialog

Ich habe ein paar ähnliche Fragen gesehen, aberleider hat keine der Antworten mein Problem genau behoben. Ich habe mehrere Modale, die jeweils einen anderen Video-iFrame haben. Ich möchte, dass das Video nicht mehr läuft, wenn der Modal geschlossen ist. Bisher habe ich versucht, mit jQuery das Video zu stoppen, wenn der Benutzer das Modal schließt. Es funktioniert, aber aus irgendeinem Grund werden alle Videos durch das erste in meinem Code aufgeführte Video ersetzt. Es ist seltsam. Sie können es hier sehen: http://tiffanymackins.com/gentrification/ Ich verwende kein Bootstrap oder irgendein Framework. Jede Hilfe wird sehr geschätzt.

Hier ist ein Ausschnitt des Codes, den ich verwende:

<a href="#modal-soulshine"><img id="soulshine-pin" class="pins" src="/images/images/redPin.png"></a>
<div id="modal-soulshine" class="modal">
<div>
<a href="#close" title="Close" class="close"> close </a>
<h2> Soulshine Organics Farm: Jesse Leadbetter and Nicole Argento</h2>
<span class="ss-info"> Moved to Belmont in 2009</span>
<iframe id="player" width="450" height="253" src="https://www.youtube.com/embed/EpDEd9R005k" frameborder="0" allowfullscreen></iframe>

<p>....</p>
</div>
</div>

Und das ist die jQuery, um das Abspielen des Videos zu stoppen:

/*Function built to take on search for youtube video in modal*/
function ytplayer() {
$(".modal iframe").attr("src", $(".modal iframe").attr(
"src"));
}
/*Function shuts down video when dismiss button is toggled*/
$(".close").click(function() {
$("#player").stop(this);
ytplayer();
});

Antworten:

Versuch es

$( "#modal-soulshine").on( "hidden.bs.modal", function (e) {

$( "#modal-soulshineiframe" ).removeAttr( "src" );

});