javascript - 使用 Jquery 将 YouTube 链接从观看更改为动态嵌入

标签 javascript java jquery html

我们如何更改 YouTube URL(链接)列表:https://www.youtube.com/watch?v= .... https://www.youtube.com/embed?v= .... 动态地在 Jquery 中,我是 html 和 jquery 的新手,请在代码中给我建议。

我的js页面:

function vidgallerylist(){
    var url=path+"/customer/video";

    $.ajax({
        type: "GET",
        url: url,
        success: function(result) {
            console.log(result);
            for(var i=0;i<result.data.length;i++){
                $('#vidlistshow').html(function(i,url){
                    var url = result.data[i].vidgalleryUrl;
                    var id = url.split('watch?v=')[2];

                    $("#tablevidgalleryid").append('<tr><td>'+result.data[i].vidgalleryTitle+'</td><td><iframe width="380" height="258" src="http://www.youtube.com/embed/' + id + '" frameborder="0" allowfullscreen></iframe></td></tr>');

                });
            }
            $('#tablevidgalleryid').DataTable();
        }
    }); 
}

html 页面:

    <h2>List of Video Gallery</h2>        
    <table class="table " id="tablevidgalleryid">
        <thead>
            <tr>
                <th>Title</th>
                <th>Videos url</th>
            </tr>
        </thead>
        <tbody id="vidlistshow">
        </tbody>
    </table>
</div>

在我的浏览器页面中如下所示:

I want List of Video in this Page dynamically (See Image)

最佳答案

试试这个

<script>
    $(document).ready(function(){
        var songsUrl = ["https://www.youtube.com/watch?v=BdRmjO04kH8", "https://www.youtube.com/watch?v=y7P9UWpHpMs", "https://www.youtube.com/watch?v=ES0oYC0hyD8"];
        $.each(songsUrl, function(index, value){

        var splitLink = value.split('watch?v=')
        var embedLink1 = splitLink.join("embed/")
            $("#result").append(index + ": " + embedLink1 + '<br>');
        });
    });
</script>


<body>
    <div id="result"></div>
</body>

关于javascript - 使用 Jquery 将 YouTube 链接从观看更改为动态嵌入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60034778/

相关文章:

javascript - 如何在 dat.gui 控件中隐藏显示文件夹?

javascript - 在 CoffeeScript 中为可选参数的字段设置默认值的简洁方法是什么?

javascript - 脚本未在 IE 的 IFrame 中运行 - FF 正常

java - Jar 文件命名约定

java - Netbeans 关于代码模板的代码帮助

javascript - 填充 div 时输入按钮停止工作

java - JDK7中Base64类的使用

使用带有特殊字符的密码的 Javascript Ajax 调用

javascript - 防止内部div触发外部div事件

javascript - 无法使用 Three.js