有人知道在javascript中嵌入YouTube视频的方法吗?还是用javascript在页面上运行一个短代码的方法?我需要一种将javascript变量传递到youtube url并嵌入视频的方法。到目前为止,我所拥有的代码是使用一个插件,它将此代码作为页面上的一个短代码运行。使用一个叫做短编码器的插件。
我做了很多研究,通常不会发新的帖子,但我似乎找不到这个基本问题的答案。如何从javascript嵌入youtube视频(或运行短代码)。我发现的一件事是这,它显示了在flashplayer中嵌入视频,但是如果可能的话,我想避免闪存,并且需要它在javascript中,这样我就可以传递一个变量。下面是我在YouTube上找到的用于获取变量的代码。
<script text="text/javascript">
var getUrlParameter = function getUrlParameter(sParam) {
var sPageURL = decodeURIComponent(window.location.search.substring(1)),
sURLVariables = sPageURL.split('&'),
sParameterName,
i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : sParameterName[1];
}
}
};
var video = getUrlParameter('v');
if(video){
console.log('v='+video);
// embed video with url
}else {
console.log('v=null');
// embed youtube uploads playlist
}
我需要一种方法嵌入youtube视频,或运行youtube wordpress插件的短代码,但需要视频网址,以影响我的网站网址。
例如:www.example.com/视频/?v=Y 123应该显示youtube视频www.youtube.com/watch?v=Y 123,而www.example.com/ video /?v=x456应该显示youtube视频www.youtube.com/watch?v=x456。
我基本上是为我的视频创建一个youtube页面,但计划添加一个实时聊天,从我的网站观看从网站上的任何地方观看的子可以使用。我也可以,可能在将来的某个时候,为教程添加自动暂停视频。
有人知道在javascript中嵌入YouTube视频的方法还是在javascript中的页面上运行短代码的方法吗?
更倾向于使用一个短代码,因为它将消除一些额外的限制,并使将来将javascript实现到wordpress中变得更加容易。
编辑:而且,我对wordpress有点陌生,虽然我在android工作室有一些经验。
发布于 2018-11-22 06:59:11
好吧,我想我想出办法让它起作用了。下面是我的代码,如果其他人需要它,如下所示:
<iframe name="videoURL" id="videoURL" width="560" height="315" src="https://www.youtube.com/embed/ymHNtBZxFKY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<script text="text/javascript">
var getUrlParameter = function getUrlParameter(sParam) {
var sPageURL = decodeURIComponent(window.location.search.substring(1)),
sURLVariables = sPageURL.split('&'),
sParameterName,
i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : sParameterName[1];
}
}
};
var video = getUrlParameter('v');
var url;
if(video){
console.log('v='+video);
url = 'https://www.youtube.com/embed/'+video;
// embed video with url
}else {
console.log('v=null');
// embed youtube uploads playlist
url = 'https://www.youtube.com/embed?listType=playlist&list=UU7YyXO5sOuG4zmGlW7KDCNw'
}
document.getElementById("videoURL").setAttribute("src", url);
</script>
发布于 2018-11-22 04:57:52
videoId:视频后面的id,即视频是“11D9G4D1p-Y” https://www.youtube.com/watch?v=1lD9G4D1p-Y
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
window.onYouTubePlayerAPIReady = function() {
window.player = new YT.Player('elementId');
window.player.cueVideoById({'videoId': 'yourVideoId',
'suggestedQuality': 'medium'});
}
我的代码和他们的代码之间的区别在于我的代码使用JavaScript添加脚本,他们的代码使用HTML添加脚本,然后使用JavaScript运行脚本。
文档 参考文献
https://stackoverflow.com/questions/53423910
复制相似问题