如何使用从输入中插入的URL嵌入Youtube视频

How to embed a Youtube Video using the URL inserted from an input

本文关键字：URL 嵌入 Youtube 视频 插入 何使用 输入      更新时间：2023-09-26

所以我正在尝试在我的网页中嵌入一个youtube视频。为了嵌入它，我需要使用用户在输入中插入的URL。我需要使用什么jquery/JavaScript来嵌入视频？

创建iframe

<iframe id="myVid" width="420" height="315"
    src="">
</iframe>

然后从用户那里获取输入，最好是url，并用jquery 传递它

$('#myVid').attr('src', "user-supplied-url")

来自@Doctor 的格式化代码

function getId(url) {
    var regExp = /^.*(youtu.be'/|v'/|u'/'w'/|embed'/|watch'?v=|'&v=)([^#'&'?]*).*/;
    var match = url.match(regExp);
    if (match && match[2].length == 11) {
        return match[2];
    } else {
        return 'error';
    }
}
var myId;
$(document).ready(function() {
    $('#embed1').click(function() {
        var myUrl = $('#URL1').val();
        myId = getId(myUrl);
        $('#youtubeID1').html(myId);
        $('#youtube1').html('<iframe width="560" height="315" src="//www.youtube.com/embed/' + myId + '" frameborder="0" allowfullscreen></iframe>');
    });
});
相关文章：