借助JS/Jquery函数,通过其URL加载youtube视频
Loading youtube videos by its URL with the help of a JS/Jquery function
我正在尝试使用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,所以这是行不通的。
相关文章:
- 如何使用url加载程序在webpack中导入多个图像
- ajax外部url加载完成后调用jquery函数
- 如何使用JavaScript通过URL加载页面内容
- PhantomJS未从同一URL加载.js
- 正在从oAuth后面的URL加载图像
- Fabric js从url加载svg缺少属性
- Javascript;html:有没有一种方法可以找到一个顶级的命名窗口(或选项卡)并将其带到前台,而不是将url加载到
- 将URL加载到CSS动画滑动iframe中
- 借助JS/Jquery函数,通过其URL加载youtube视频
- 我的Javascript没有'当我把一个脚本元素放在头上从URL加载它时,它不起作用
- 将Parse.File url加载到EJS模板中
- 打开一个模态(在Codeigniter中),该模态从依赖于phpvar的URL加载(在iframe中)内容
- Javascript函数根据URL加载不同的config.json文件
- 仅当从另一个 URL 加载数据时,才会触发另一个插件
- 将URL加载到iframe中并查找刚刚加载的HTML的值 - Jquery
- 以编程方式将 URL 加载到 ng 视图中
- 通过 GET URL 加载引导导航导航选项卡
- JavaScript 中的函数在通过单击 href url 加载新页面时不会调用
- 从新的 JSON URL 加载更多数据
- Javascript:从拆分字符串 url 加载多个图像