Jquery如何在播放下一个视频之前关闭上一个视频

Jquery how to close last video before streaming the next?

本文关键字:视频 上一个 下一个 播放 Jquery      更新时间:2023-09-26

我正在处理这段代码从过去的2天。我试了很多方法,但都没能达到我想要的效果。

这是我的代码

<html>
<body>
<a href="#" onclick="myLink('0HTo_ySoct4');">Click me!</a>
<a href="#" onclick="myLink('PxWDfisVmzg');">Click me!</a>
<div id="0HTo_ySoct4">The text will get loaded here</div>
<div id="PxWDfisVmzg">The text will get loaded here</div>

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
function myLink(Yt) {
var yout = Yt;
var myurl = '<iframe src="https://www.youtube.com/embed/' + yout + '?autoplay=1&rel=0&controls=1" width="450" height="300" frameborder="0" class="player"></iframe>';
$('.player').hide();
$("#"+yout).html(myurl);
}
</script>
</body>
</html>

让我解释一下我想要什么以及代码在做什么。

看,我有两个点击我标签。我可以有更多点击我TAB在20左右,这取决于结果。

All选项卡包含youtube视频id。

所以当我点击任何点击我标签播放视频。视频将被加载到相关的div中。我想加载每个视频正好低于他们的特定视频描述/细节。它工作,但有一个bug。

错误是,当我试图点击第二个点击我标签。第一个将从网页中隐藏,但视频仍将在后台播放,您将听到两个视频的音频。

我想在播放下一个视频之前完全关闭上一个视频。我做了很多改变,但没有得到修复,所以现在我需要一点帮助,从你的专家家伙。

请帮帮我。

在播放下一个视频之前,我怎么才能完全关闭上一个视频?只是因为div id不同,我有这个问题,但我需要在我的项目。

提前致谢

像这样做

<html>
<body>
<a href="#" onclick="myLink('0HTo_ySoct4');">Click me!</a>
<a href="#" onclick="myLink('PxWDfisVmzg');">Click me!</a>
<div class="youtubeVideo" id="0HTo_ySoct4">The text will get loaded here</div>
<div class="youtubeVideo" id="PxWDfisVmzg">The text will get loaded here</div>

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
function myLink(Yt) {
var yout = Yt;
var myurl = '<iframe src="https://www.youtube.com/embed/' + yout + '?autoplay=1&rel=0&controls=1" width="450" height="300" frameborder="0" class="player"></iframe>';
$('.player').hide();
$(".youtubeVideo").empty();
$("#"+yout).html(myurl);
}
</script>
</body>
</html>

基本上是在加载新视频之前清空所有显示视频的div