来自 Wordpress 中文本文件的 jQuery iFrame 变量
Posted
技术标签:
【中文标题】来自 Wordpress 中文本文件的 jQuery iFrame 变量【英文标题】：jQuery iFrame Variable from Text File in Wordpress 【发布时间】：2017-02-27 00:17:51 【问题描述】：我正在尝试使用存储在 Wordpress 中的文本文件中的一组 URL 和参数嵌入视频，这些 URL 和参数在 F5 刷新时随机更改。我不是编码员，但我认为我很接近，但是错了，示例在这里：
http://aaaad.com/jquery-forum-post/
我尝试了很多不同的方法，但似乎无法从文件中正确传递参数以在第二个视频帧中显示随机视频和刷新参数。从上面的链接：
第一个视频是带有启动和停止参数的 iframe 嵌入命令，效果很好 第二个视频尝试使用“video”的 var 作为 src= 值的开头 底部是文件中的随机行，该行在刷新页面时使用 div 类正确更改，就像我想要视频链接一样。感谢任何帮助重定向我明显不正确的方法。代码如下：
<iframe width="854" height="480" src="https://www.youtube.com/embed/ad5pmvJ0zMQ?start=1&end=23" frameborder="0" allowfullscreen></iframe>
`<iframe 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"
再次感谢您的帮助，
【问题讨论】：
【参考方案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。这不起作用——您需要使用 URL 填充 iframe 源属性标记以使其工作。现在引出一个问题：您为什么要在 Javascript 中这样做？页面加载后是否需要再次更改随机视频？看起来你可以只用 php 更简单地做到这一点。您将从文本文件中读取，随机选择其中一个 URL，然后在页面加载时输出
<iframe src="$source">，而不是通过 AJAX 和 Javascript。
【讨论】：
谢谢格雷格。您对 div 关闭是正确的，我在上面复制和更正时错过了它。 2.就 Math.random() 而言，它似乎确实按原样正确随机化。您可以在底部上方的链接中看到，我在按 F5 刷新时打印出文本文件的当前值。我希望如果它在那里随机化，如果我能弄清楚他的语法，它可以将我尝试做的地方添加为 src=video 作为 iframe 的一部分。我真正想做的就是按原样从文件中检索到的值并用它替换 $video。我在那里的那个 div 只是为了能够看到它在做什么。 3.我希望你可能是对的。但是，每次刷新页面时，我都需要它一次又一次地刷新。除了这里的内容之外，我还有很多东西要添加到这个页面中，我已经在 jQuery 中添加了很多内容，我将加入其中，希望 jQuery 的学习经验会有所帮助。非常感谢， 明白！我什至想知道您的部分问题是否是 jQuery / Javascript 在页面加载后触发，到那时 iFrame 已经在页面 DOM 中，没有源属性。我只是担心Javascript真的不是解决这个问题的方法。 PHP 也可以在每次页面加载时为您随机化源代码，并且在页面发送到浏览器之前完成所有操作。 谢谢格雷格。我肯定有一些学习要做，我希望你是对的。我现在在一个直接的 html 页面上工作的代码接近上面的代码，但不是 WordPress。我确实看到了关于 jQuery 事件序列何时出现并需要消化它的信息。我一直在探索你推荐的 php 选项，我想我明白你的意思。非常感谢您的帮助。【参考方案2】：对于在这里工作的 html 版本，Jake 在 jquery 论坛上对任何人都感兴趣。 （尚未弄清楚如何使其在 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 frameborder="0" allowfullscreen></iframe>
<div class="video">
</body>
【讨论】：
以上是关于来自 Wordpress 中文本文件的 jQuery iFrame 变量的主要内容，如果未能解决你的问题，请参考以下文章
在 phpMyAdmin db 或 WordPress 站点中添加/上传文本文件
Jquery Validation 不适用于 wordpress 插件
php 创建 zip 文件（来自 post 附件 wordpress）