javascript - 如何从数组获取链接以在youtube Iframe API中播放?

标签 javascript arrays iframe youtube

我想从我的数组中获取链接,然后拆分字符串以获取Youtube视频ID:“Dg_0L9jJuoo”,以便将其提供给api。第二个问题是如何使api自动播放数组中的视频。

这是我的数组:

[{“id”:“697f46e3-6426-4177-ac87-6ff1a4d9d6d5”,“title”:“Muusika”,“link”:“https://www.youtube.com/watch?v=Dg_0L9jJuoo”},{“id”:“f8107406-f2a6-4ede-9835-fc38766d607e “,” title“:” Muusika“,” link“:” https://www.youtube.com/watch?v=p9j8RGTqju0“}]

提前致谢

最佳答案

这个怎么样?我希望符合您的期望

您可以在jsfiddle中看到它:https://jsfiddle.net/nauvalazhar/vxgwkfdh/2/

*欢呼

<!DOCTYPE html>
<html>
<head>
    <title>Youtube Player</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.12.1.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        // Your array data
        var youtube = [
            {
                "id":"697f46e3-6426-4177-ac87-6ff1a4d9d6d5",
                "title":"Muusika",
                "link":"https://www.youtube.com/watch?v=Dg_0L9jJuoo"
            },
            {
                "id":"f8107406-f2a6-4ede-9835-fc38766d607e",
                "title":"Muusika",
                "link":"https://www.youtube.com/watch?v=p9j8RGTqju0"
            }
        ];
        // Extract a array
        $.map(youtube, function(value, key) {
            // take the id of youtube link on your array
            var id = value.link.split("?v="),
                id = id[1];

            // and displays embed youtube to element #youtube-video
            $("#youtube-video").append($("<iframe />", {
                src: "https://youtube.com/embed/"+id+"?autoplay=1",
                frameborder: 0,
                width: "100%",
                height: 300
            }))
        });
    });
    </script>
</head>
<body>
    <div id="youtube-video"></div>
</body>
</html>

关于javascript - 如何从数组获取链接以在youtube Iframe API中播放?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36016171/

相关文章:

python - selenium 切换到 iframe 来定位元素

c# - IFrame : Page is post back or refreshing on iframe src

javascript - 检测 undefined object 属性

javascript - Dojo 有编码标准吗?

java - 如何打印/引用第 7 号人物?

arrays - delphi 保存和加载动态数组

javascript - 与 Map 相比,使用 Object.create(null) 有什么优势吗?

javascript - 选择不同选项后隐藏/显示表格

python - 索引错误: list assignment index out of range - Python with an array

javascript - 我怎样才能得到一个华丽的弹出窗口来在一个动态画廊中同时显示图像和 iframe 视频?