Question

可以帮助我使用我的代码

我的网页是关于切换iframe

当我点击视频1时，它有data-str =＆＃34; p9zdCra9gCE＆＃34;

它只会更改class =＆＃34; loading_video＆＃34;

中iframe的src结尾

所以我需要这样做...... 当我点击视频1或视频2时，我应该得到＆＃34; p9zdCra9gCE＆＃34;在url上使它像page.php？p9zdCra9gCE

所以有人导航到page.php？p9zdCra9gCE或page.php？0_MfMUN_FNM 然后，数据格式应该在iframe上，而不是通过单击视频按钮进行切换。希望你能理解这些人，到目前为止，没有人帮助过我们。

这是我在plnkr http://plnkr.co/edit/IPY3GF7Poyv1URrk84FH?p=preview

上的完整代码

这是我的PHP代码

<?php

        $id = 1;
        foreach (glob('directory/*.php') as $file) {
            $file = str_replace('directory/', '', $file);
            $file = str_replace('.php', '', $file); ?>
            <div style="display:block;" class="video_link" data-str="<?php echo $file; ?>">Video <?php echo $id++ ?></div>
        <?php }

        ?>

这是我的javascript代码

<script>
    $(document).ready(function() {
        $(".frame_src").attr("data-src", "https://www.youtube.com/embed/p9zdCra9gCE");
        var t = "p9zdCra9gCE",
            e = $(".embed_code").attr("data-content");
        e = e.replace("[videoID]", t), $(".embed_code").html(e), $(".video_button").slideDown(), $(".video_link").click(function() {
            $(".reloadframe").show();
            var t = $(this).attr("data-str"),
                e = "https://www.youtube.com/embed/" + t + "",
                a = $(".embed_code").attr("data-content");
            a = a.replace("[videoID]", t), $(".embed_code").html(a), $(".frame_src").attr("src", e), clearInterval(interval), document.querySelector(".load_video").style.display = "none", $(".frame_src").show()
        })
    });
            </script>

Answer 1

查看jQuery的.click()或.on()方法文档。您希望使用阻止默认单击操作（在这种情况下，您将停止链接从导航到新页面）并将其替换为使用所述链接更新iframe。代码看起来像这样：

$(document).ready(function() {
    //bind listener to elements the are used to update the iframe
    $('.updateFrame').on('click', function(e) {
        e.preventDefault(); //stop normal click event
        $('.videoFrame').attr('src', $(this).data('src')); //update iframe src
    });
});

获取url的变量并导航选择的变量

1 个答案: