Question

我在调用函数时遇到问题。每当我点击链接时，它似乎都会忽略该功能，只需在youtube全屏模式下打开视频。

<script language="javascript" type="text/javascript">
    $("#movies a.youtube").click(function()
         {
            var videoAddress = $(this).attr("href");
            $("#videoArea").html(" ");
            $("#videoArea").html('<iframe width="560" height="315" src="' + videoAddress + '" frameborder="0" allowfullscreen></iframe>');

            return false;
        });
</script>

这是HTML。我故意留下没有链接的其他项目，因为我只是试图测试基本功能。

<div id="videoArea">
        <iframe width="560" height="315" src="http://www.youtube.com/embed/mMK9kQtl_i4?rel=0" frameborder="0" allowfullscreen>  </iframe>
</div>
        <nav id="movies">
            <ul>
                <li><a class="youtube" href="http://www.youtube.com/embed/mMK9kQtl_i4?rel=0">Nut Job</a></li>
                <li><a class="youtube" href="http://www.youtube.com/embed/9G9Ce7e-gws?rel=0">Devil's Due</a></li>
                <li><a class="youtube" href="">Ride Along</a></li>
                <li><a class="youtube" href="">Saving Mr. Banks</a></li>
                <li><a class="youtube" href="">Frozen</a></li>
            </ul>
            </nav>

Answer 1

尝试将jquery代码放在$(function(){});中，以便为加载DOM提供时间。

$(function() {
    $("#movies a.youtube").click(function()
         {
            var videoAddress = $(this).attr("href");
            $("#videoArea").html(" ");
            $("#videoArea").html('<iframe width="560" height="315" src="' + videoAddress + '" frameborder="0" allowfullscreen></iframe>');

            return false;
        });
});

使用链接更改嵌入式Youtube视频的问题

1 个答案: