借助JS/Jquery函数,通过其URL加载youtube视频

Loading youtube videos by its URL with the help of a JS/Jquery function

本文关键字:URL 加载 youtube 视频 JS Jquery 函数 借助      更新时间:2023-09-26

我正在尝试使用JS函数加载youtube视频。其目的是让用户简单地将youtube视频URL复制并粘贴到输入字段中,然后让我的JS代码负责加载部分。不幸的是,我不确定为什么js代码没有加载任何视频?JS小提琴

JS:

<script>
       $(document).ready(function(){
        var last_cnad_text_1 = '';
        var options_cnad_text_1 = {
        embedMethod:'fill',
        maxWidth:320,
        maxHeight: 320
        };
        function loadVideo()
        {
        val = $('#cnad_text_1').val();
        if ( val != '' && val != last_cnad_text_1 )
        {
        last_cnad_text_1 = val;
        $("#embed_cnad_text_1").oembed(val,options_cnad_text_1);
        }
        }
        $(function(){
        $('#cnad_text_1').keydown(loadVideo());
        $('#cnad_text_1').click(loadVideo());
        $('#cnad_text_1').change(loadVideo());
        });
        });
​</script>

html:

<html>
<div class="col1">Insert a youtube video Link</div>
   <div class="col2">
   <input id="cnad_text_1" type="text" name="cnad[text_1]">
   <div id="embed_cnad_text_1">
   <iframe></iframe>
    </div>
</div>​
</html>

$('#cnad_text_1').keydown(loadVideo());错误。您正在立即调用函数,而不是将其指定为事件的回调。移除(),它应该可以工作:

$('#cnad_text_1').keydown(loadVideo);
$('#cnad_text_1').click(loadVideo);
$('#cnad_text_1').change(loadVideo);

事实上,你可以把它浓缩得更多:

$('#cnad_text_1').on('keydown click change', loadVideo);

我认为您最好使用"swfobject"来为您进行嵌入。您可以使用jquery简单地从文本框中提取值。

jsfiddle不允许在演示中使用iframe,所以这是行不通的。