如何在javascript中从html引用iframe

时间:2014-03-03 17:35:26

标签: javascript jquery html css iframe

我刚刚开始学习html和css,现在我想添加一些javascript,我什么都不知道!

我想创建一个随机按钮,在iframe中显示随机嵌入视频(例如来自1-5个视频)。我搜索了谷歌,发现了一个javascript /(jquery?):

<script type="text/javascript" src="jquery-1.11.0.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {

var array=["Item1", "Item2", "Item3", "Item4", "Item5"];
$('#button').bind('click', function() {

    var random = array[Math.floor(Math.random() * array.length)];
    $("h1").html(random);
});
});
</script>

使用html:

<h1>Will be replaced</h1>
<button id="button">Random</button>

所以例如在我的html中我得到了:

<iframe width="640" height="360" src="http://www.youtube.com/embed/npvNPORFXpc"     frameborder="0" allowfullscreen></iframe>           

我想要在页面上显示此嵌入视频,当您点击随机按钮时,它应该更改为1-5视频。如何将其设置为javascript中的项目,因此我在每个项目上都有一个视频?

问题2:

有时生成相同的数字会导致相同的项目。

我希望有人可以教我一些关于此的事情!

1 个答案:

答案 0 :(得分:1)

它可能不多,但是一个起点: Click me

刚刚找到我能找到的前5个视频ID:))

这是Js:

$(document).ready(function() {
    var array=["FOIjvHjK0Rw", "CcsUYu0PVxY", "dE_XVl7fwBQ", "iIwxR6kjTfA", "USe6s2kfuWk"];
    $('#button').bind('click', function() {
        var random = array[Math.floor(Math.random() * array.length)];
        $("h1").html(random);
        var url="http://www.youtube.com/embed/"+random;
        $('#frame').attr('src', url);
        $('#frame').css('visibility','visible');
    });
});