javascript - 在模式关闭时暂停 YouTube 视频

Question

我正在开发一个在 Bootstrap 模式中播放 YouTube 视频的页面。 我已经制作了这个 JS 函数来在模态关闭时暂停视频，但仅适用于 3 个模态。

var player1;
var player2;
var player3;
function onYouTubePlayerAPIReady() {player1 = new YT.Player('ytplayer1'); player2 = new YT.Player('ytplayer2'); player3 = new YT.Player('ytplayer3');}
$('#Video1').on('hidden.bs.modal', function () {
    player1.pauseVideo();
    });
$('#Video2').on('hidden.bs.modal', function () {
    player2.pauseVideo();
    });
$('#Video3').on('hidden.bs.modal', function () {
    player3.pauseVideo();
    });

目前我正在从数据库添加视频。这些视频以 id="Video_#" 模式打开，其中 # 是数据库中视频的 ID。 (与 ytplayer# 相同)

如何更改脚本以在关闭相应模态时暂停视频？

TIA

Answer 1

要使该功能适用​​于页面上的任何视频，您可以执行以下操作。

var videoIds = [1, 2, 3, 4, 5, 6];

videoIds.map(function (id) {
    var videoPlayer = new YT.Player('ytplayer' + id);

    $('#Video' + id).on('hidden.bs.modal', function () {
        videoPlayer.pauseVideo();
    });
});