Измените ссылку YouTube с watch на динамическое встраивание, используя Jquery - PullRequest
0 голосов
/ 03 февраля 2020

Как изменить список URL-адресов YouTube (ссылки) с 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)

1 Ответ

1 голос
/ 03 февраля 2020

Попробуйте это

<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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...