如何使网页上一次只播放一个嵌入式视频作为浏览器扩展，youtube

这条线索看起来接近于回答我的问题

我仍然会去一些新闻网站和有视频教程的网站，这些网站有一长串嵌入视频

我想我可以制作一个插件，在每个视频元素和嵌入式元素中添加javascript，关闭自动播放，并告诉除播放之外的所有内容停止播放

我不知道这方面的确切代码，但当我为出版商搜索解决方案时，在我开始写这篇文章之前，我什么也没找到，相关的搜索得到了很好的信息

---

是此类页面的一个示例。

一次一个YouTube嵌入的HTML视频

就连我几天前也遇到了同样的问题，当时我正在制作视频传送带。。。最后，我现在有了一个解决方案。。。首先，使用

标记嵌入youtube视频，并在视频url的末尾键入以下内容

？html5=1&enablejsapi=1

。。。然后直接在您的项目中包含以下JavaScript代码，而无需对其进行任何编辑

所需函数的JavaScript代码如下-

      <script>
    var ytplayerList;

    function onPlayerReady(e) {
        var video_data = e.target.getVideoData(),
            label = video_data.video_id+':'+video_data.title;
        e.target.ulabel = label;
        console.log(label + " is ready!");

    }
    function onPlayerError(e) {
        console.log('[onPlayerError]');
    }
    function onPlayerStateChange(e) {
        var label = e.target.ulabel;
        if (e["data"] == YT.PlayerState.PLAYING) {
            console.log({
                event: "youtube",
                action: "play:"+e.target.getPlaybackQuality(),
                label: label
            });
            //if one video is play then pause other
            pauseOthersYoutubes(e.target);
        }
        if (e["data"] == YT.PlayerState.PAUSED) {
            console.log({
                event: "youtube",
                action: "pause:"+e.target.getPlaybackQuality(),
                label: label
            });
        }
        if (e["data"] == YT.PlayerState.ENDED) {
            console.log({
                event: "youtube",
                action: "end",
                label: label
            });
        }
        //track number of buffering and quality of video
        if (e["data"] == YT.PlayerState.BUFFERING) {
            e.target.uBufferingCount?++e.target.uBufferingCount:e.target.uBufferingCount=1; 
            console.log({
                event: "youtube",
                action: "buffering["+e.target.uBufferingCount+"]:"+e.target.getPlaybackQuality(),
                label: label
            });
            //if one video is play then pause other, this is needed because at start video is in buffered state and start playing without go to playing state
            if( YT.PlayerState.UNSTARTED ==  e.target.uLastPlayerState ){
                pauseOthersYoutubes(e.target);
            }
        }
        //last action keep stage in uLastPlayerState
        if( e.data != e.target.uLastPlayerState ) {
            console.log(label + ":state change from " + e.target.uLastPlayerState + " to " + e.data);
            e.target.uLastPlayerState = e.data;
        }
    }
    function initYoutubePlayers(){
        ytplayerList = null; //reset
        ytplayerList = []; //create new array to hold youtube player
        for (var e = document.getElementsByTagName("iframe"), x = e.length; x-- ;) {
            if (/youtube.com\/embed/.test(e[x].src)) {
                ytplayerList.push(initYoutubePlayer(e[x]));
                console.log("create a Youtube player successfully");
            }
        }

    }
    function pauseOthersYoutubes( currentPlayer ) {
        if (!currentPlayer) return;
        for (var i = ytplayerList.length; i-- ;){
            if( ytplayerList[i] && (ytplayerList[i] != currentPlayer) ){
                ytplayerList[i].pauseVideo();
            }
        }  
    }
    //init a youtube iframe
    function initYoutubePlayer(ytiframe){
        console.log("have youtube iframe");
        var ytp = new YT.Player(ytiframe, {
            events: {
                onStateChange: onPlayerStateChange,
                onError: onPlayerError,
                onReady: onPlayerReady
            }
        });
        ytiframe.ytp = ytp;
        return ytp;
    }
    function onYouTubeIframeAPIReady() {
        console.log("YouTubeIframeAPI is ready");
        initYoutubePlayers();
    }
    var tag = document.createElement('script');
    //use https when loading script and youtube iframe src since if user is logging in youtube the youtube src will switch to https.
    tag.src = "https://www.youtube.com/iframe_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);    

  </script>

沟球转盘
&拉阔；
&拉阔；
游戏主义者；
函数onPlayerReady（e）{
var video_data=e.target.getVideoData（），
label=video_data.video_id+'：'+video_data.title；
e、 target.ulabel=标签；
日志（标签+“准备就绪！”）；
}
函数onplayerror（e）{
console.log（'[onPlayerError]”）；
}
函数onPlayerStateChange（e）{
var标签=e.target.ulabel；
如果（e[“数据”]==YT.PlayerState.PLAYING）{
console.log({
事件：“youtube”，
动作：“播放：+e.target.getPlaybackQuality（），
标签：标签
});
//如果正在播放一个视频，则暂停另一个视频
暂停其他管道（如目标）；
}
如果（e[“数据”]==YT.PlayerState.PAUSED）{
console.log({
事件：“youtube”，
操作：“暂停：+e.target.getPlaybackQuality（），
标签：标签
});
}
如果（e[“数据”]==YT.PlayerState.ENDED）{
console.log({
事件：“youtube”，
行动：“结束”，
标签：标签
});
}
//缓冲音轨数和视频质量
如果（e[“数据”]==YT.PlayerState.BUFFERING）{
e、 target.uBufferingCount？+e.target.uBufferingCount:e.target.uBufferingCount=1；
console.log({
事件：“youtube”，
操作：“缓冲[”+e.target.uBufferingCount+”]：“+e.target.getPlaybackQuality（），
标签：标签
});
//如果播放一个视频，则需要暂停另一个视频，因为开始时视频处于缓冲状态，开始播放时不进入播放状态
if（YT.PlayerState.UNSTARTED==e.target.uLastPlayerState）{
暂停其他管道（如目标）；
}
}
//最后一个动作在uLastPlayerState中保持阶段
if（e.data！=e.target.uLastPlayerState）{
console.log（标签+”：状态从“+e.target.uLastPlayerState+”更改为“+e.data”）；
e、 target.uLastPlayerState=e.data；
}
}
函数inityoutubeplyers（）{
ytplayerList=null；//重置
ytplayerList=[]；//创建新数组以容纳youtube播放器
对于（var e=document.getElementsByTagName（“iframe”），x=e.length；x--；）{
if（/youtube.com\/embed/.test（e[x].src））{
ytplayerList.push（inityoutubeplyer（e[x]）；
log（“成功创建Youtube播放器”）；
}
}
}
功能暂停其他输出管（currentPlayer）{
如果（！currentPlayer）返回；
for（var i=ytplayerList.length；i--；）{
if（ytplayerList[i]&&（ytplayerList[i]！=currentPlayer））{
ytplayerList[i].pauseVideo（）；
}
}  
}
//初始化youtube iframe
函数inityoutubeplyer（ytiframe）{
log（“拥有youtube iframe”）；
var ytp=新的YT.播放器（YT帧{
活动：{
onStateChange:onPlayerStateChange，
onError:ONPLAYERROR，
onReady:onPlayerReady
}
});
ytiframe.ytp=ytp；
返回ytp；
}
函数onyoutubeiframeapiredy（）{
log（“YouTubeIframeAPI已准备就绪”）；
initYoutubePlayers（）；
}
var tag=document.createElement（'script'）；
//加载脚本和youtube iframe src时使用https，因为如果用户登录youtube，youtube src将切换到https。
tag.src=”https://www.youtube.com/iframe_api";
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag