Javascript 我嵌入的YouTube视频停止工作

我正在开发一个网站，主页上嵌入了一些youtube视频。直到最近，这些视频还很不错，但现在看来它们不再有效了！它从YouTube上获取视频，但我无法播放任何视频

我将代码与早期版本进行了比较，代码仍然是一样的。几个小时以来，我一直在寻找这个问题，想弄明白为什么它不再有效了。下面是一个JSFIDLE，其中包含我正在使用的代码。

你知道我需要做什么来解决这个问题吗

HTML

JS

var frame=document.getElementById（'striser'）；
var-pos=0；
var src=[
"https://www.youtube.com/embed/PNT39y4N4H4?rel=0",
"https://www.youtube.com/embed/M--kEKu8-IE?rel=0",
"https://www.youtube.com/embed/3wgd8fHidzg?rel=0",
"https://www.youtube.com/embed/2yf4bUW9mlE?rel=0",
"https://www.youtube.com/embed/CueAcWRsaY8?rel=0",
"https://www.youtube.com/embed/ulsa6Aog7Yw?rel=0",
"https://www.youtube.com/embed/7qTp3lk7gt4?rel=0"
]
函数nextVideo（）{
如果（位置<6）{
pos+=1；
showVideo（）；
}
}
函数previousVideo（）{
如果（位置>0）{
pos-=1；
showVideo（）；
}
}
函数showVideo（）{
frame.src=src[pos]；
}
函数barnaby（）{
pos=1；
frame.src=src[pos]+“&autoplay=1”；
}

将iframe移出splashdiv-这样应该可以让视频运行

z-index

太低，您需要增加它，它位于另一个
div
后面。这里显示了一个解决方案，尽管您不需要使用200，只是一个示例：）
用这个替换您的
.splashdiv
css代码

.splashdiv {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 51%;
  z-index:2;
}

只需删除这一行：

z-index:-1

z-index:-1
将整个
.splashdiv
div（包括iframe）设置在主体层后面。所以YouTube iframe无法捕获您的鼠标点击。
真不敢相信我没有想到z-index。。。谢谢你的快速回答！还有一个问题。。如您所见，barnaby函数将自动播放添加到src，但触发后，我只得到“此视频不可用”有什么想法吗？我是否为自动播放使用了正确的参数？编辑：我发现视频以某种方式设置为私人。。。问题解决
        var frame = document.getElementById('teaser');
        var pos = 0;
        var src = [
            "https://www.youtube.com/embed/PNT39y4N4H4?rel=0",
            "https://www.youtube.com/embed/M--kEKu8-IE?rel=0",
            "https://www.youtube.com/embed/3wgd8fHidzg?rel=0",
            "https://www.youtube.com/embed/2yf4bUW9mlE?rel=0",
            "https://www.youtube.com/embed/CueAcWRsaY8?rel=0",
            "https://www.youtube.com/embed/ulsa6Aog7Yw?rel=0",
            "https://www.youtube.com/embed/7qTp3lk7gt4?rel=0"
        ]

        function nextVideo() {
            if (pos < 6) {
                pos += 1;
                showVideo();
            }
        }
        function previousVideo() {
            if (pos > 0) {
                pos -= 1;
                showVideo();
            }
        }
        function showVideo() {
            frame.src = src[pos];
        }
        function barnaby() {
            pos = 1;
            frame.src = src[pos]+"&autoplay=1";
        }

.splashdiv {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 51%;
  z-index:2;
}

z-index:-1