Question

我正在尝试使用存储在Wordpress中的文本文件中的一组网址和参数来嵌入视频，这些参数会在F5刷新时随机更改。我不是编码员，但我认为我很接近，但错了，例子就在这里：

我尝试了很多不同的方法，但似乎无法从文件中正确传递参数，以便在第二个视频帧中显示刷新时的随机视频和参数。从上面的链接：

第一个视频是带有启动和停止参数的iframe嵌入命令，并且工作正常
第二个视频是尝试使用var“video”作为src = values的开头
是文件中的一个随机行，在刷新页面时使用div类正确更改，就像我想要视频链接一样。

任何有助于重定向我明显不正确的方法的帮助表示赞赏。这是代码：

<iframe width="854" height="480" src="https://www.youtube.com/embed/ad5pmvJ0zMQ?start=1&end=23" frameborder="0" allowfullscreen></iframe>

`<iframe width="854" height="480" src=$video frameborder="0" allowfullscreen></iframe>

<div class="video"></div>

<script type="text/javascript" src="js/jquery.js"></script>
<script>// <
jQuery(document).ready(function($) {
    $.get('/wp-content/slap/video.txt', function(data) {
        var video = data.split("@");
        var idx = Math.floor(video.length * Math.random());
        $('.video').html(video[idx]);
    });
});
</script>

` video.txt的内容

"https://www.youtube.com/embed/ad5pmvJ0zMQ?start=398&end=418"@
"https://www.youtube.com/embed/ad5pmvJ0zMQ?start=39&end=41"@
"https://www.youtube.com/embed/ad5pmvJ0zMQ?start=98&end=108"@
"https://www.youtube.com/embed/ad5pmvJ0zMQ?start=60&end=67"@
"https://www.youtube.com/embed/ad5pmvJ0zMQ?start=7&end=20"

再次感谢您的帮助，

Answer 1

我发现了一些事情......

.video div永远不会关闭，因此可能会导致一些问题。（也许它在您的普通代码中有效，但它并不适用于您在上面发布的内容。
这：

var video = data.split("@"); idx = Math.floor(video.length * Math.random());

似乎没有按你的意愿行事。 Math.random（），如果不带参数调用，则返回0到1之间的小数。要使它在两个数字之间，必须提供最小值和最大值。在你的代码中，idx变量很可能只是零。我想你可能需要idx = Math.random(0, video.length - 1);

您将.video的HTML设置为所选视频的网址。这不起作用 - 您需要使用URL填充iframe源属性标记以使其工作。现在提出了一个问题：您为什么要在Javascript中执行此操作？页面加载后是否需要再次更改随机视频？看起来你只需用PHP就可以做到这一点。您从文本文件中读取，随机选择其中一个URL，然后在页面加载时输出<iframe src="$source">，而不是通过AJAX和Javascript。

Answer 2

对于在这里工作的html版本，在任何人都感兴趣的情况下，jquery在jquery论坛上赞美。（Haven还没弄明白如何让它在WordPress中运行，这可能是由于Greg的回答）。视频文字的内容在原始帖子中。以下是代码的HTML版本：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>Untitled</title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script>
    </script>
    <style>
iframe {
  width: 100%;
  height: 500px;
  border:1px solid red;
}

    </style>
<script>
jQuery(document).ready(function($) {
    $.get('video.txt', function(data) {
        var video = data.split("@");
        var idx = Math.floor(video.length * Math.random());
        console.log(video[idx])
        $("iframe").attr("src",video[idx]);
    });
});
</script></head>
<body>
<iframe width="854" height="480"  frameborder="0" allowfullscreen></iframe>

<div class="video">

</body>

Wordpress中文本文件的jQuery iFrame变量

2 个答案: