我正在为Facebook的视频编写一个非常简单的选择器，以嵌入我的页面（在我自己的域中）它正在工作..但是当我更改视频时，前一个的声音不会停止。选择器使用Facebook的Javascript SDK和每个视频的Js代码，并使用jquery addClass和removeClass通过CSS选择它们。添加/删除＆＃34;显示：无＆＃34; CSS属性。
<html>
<head>
<title>Fb player</title>
</head>
<body>
<!-- Load Facebook SDK for JavaScript -->
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '{xxxxxxxxxxxx}',
xfbml : true,
version : 'v2.5'
});
// Get Embedded Video Player API Instance
var my_video_player;
FB.Event.subscribe('xfbml.ready', function(msg) {
if (msg.type === 'video') {
my_video_player = msg.instance;
}
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- Your embedded video player code -->
<div
class="fb-video"
data-href="https://www.facebook.com/xxxxxxxxxxx/videos/XXXXXXXXXXXXXXXX/"
data-width="500"
data-allowfullscreen="true"></div>
<button onClick="my_video_player.pause()">Click me</button>
</body>
</html>
这是我之前使用的代码（在我创建了Facebook的开发者帐户并获得我的应用的ID之前），通过jquery / CSS隐藏/取消隐藏视频
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Fb Live Player</title>
<link rel="stylesheet" href="css/main.css" />
<style>
.outview{ display:none;}
#vid0ctn{ width:500px; height:30rem;}
</style>
</head>
<body>
<!--SDK FB-->
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/es_LA/sdk.js#xfbml=1&version=v2.9";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<!--SDK FB END-->
<div id="vid0ctn">
<div>Video placeholder</div>
</div>
<div id="vid1ctn" class="outview">
<div class="fb-video" data-href="https://www.facebook.com/buzzfeedtasty/videos/1909246735994633/" data-width="500" data-show-text="false"><blockquote cite="https://www.facebook.com/buzzfeedtasty/videos/1909246735994633/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/buzzfeedtasty/videos/1909246735994633/">6 Cheesecake Recipes</a><p>These 6 cheesecake recipes will have all your cheesecake cravings covered !
FULL RECIPES: http://bzfd.it/2pIMiU9</p>Posted by <a href="https://www.facebook.com/buzzfeedtasty/">Tasty</a> on viernes, 21 de abril de 2017</blockquote></div>
</div>
<div id="vid2ctn" class="outview">
<div class="fb-video" data-href="https://www.facebook.com/NowThisFuture/videos/1541708712536970/" data-width="500" data-show-text="false"><blockquote cite="https://www.facebook.com/NowThisFuture/videos/1541708712536970/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/NowThisFuture/videos/1541708712536970/">Roads Made From Recycled Plastic</a><p>Roads made with recycled plastic are a win for drivers, local governments, and the earth</p>Posted by <a href="https://www.facebook.com/NowThisFuture/">NowThis Future</a> on viernes, 28 de abril de 2017</blockquote></div>
</div>
<button id="vidbtn1" class="button">xxxxx VIDEO</button><button id="vidbtn2" class="button">xxxxxx FB VIDEO</button>
</div>
<script src="js/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
$("#vidbtn1").click(function() {
$("#vid1ctn").removeClass("outview");
$("#vid0ctn").addClass("outview");
$("#vid2ctn").addClass("outview");
});
</script>
<script type="text/javascript">
$("#vidbtn2").click(function() {
$("#vid2ctn").removeClass("outview");
$("#vid0ctn").addClass("outview");
$("#vid1ctn").addClass("outview");
});
</script>
</body>
</html>
关于这一点的整个想法是（一旦我能够操纵视频播放器）在一个div中加载几个facebook视频并用播放器本身外的按钮操作它们
答案 0 :(得分：0)
根据您的问题，目前还不清楚您如何设置选择器，但也许您可以使用SDK提供的Player Controls API。您可以使用pause()方法暂停正在播放的视频，然后再启动新视频。