无法使用 Javascript 更改 HTML iframe 源

Question

我正在尝试在我的网站上添加 'video of the day'。我目前已经完成了大部分工作，下面是我计划让它最终工作的方式：

有一个 Python 脚本运行每 24 小时一次，以选择当天的随机 YouTube 视频
将嵌入视频URL写入文本文件
使用Javascript访问文本文件并抓取视频URL，并将其用作我网页上的iframe源

正如我上面提到的，该计划目前大部分都有效。我的脚本能够选择随机视频，并将其写入文本文件。然后我的网页能够从文本文件中提取视频URL，并以文本形式将其写入网页。但是，我在将视频 URL 写入我的 iframe 时遇到了一些麻烦。

我做了一些搜索，人们建议尝试以下代码：

<iframe id="mainvideo" width="720" height="480" frameborder="0" src="" allowfullscreen></iframe>

<script>
document.getElementById("mainvideo").src =
          finalresult + ReturnURL();
</script>

所以在我的代码的前面，我将变量 'finalresult' 声明为以下值：//www.youtube.com/embed/WJDnJ0vXUgw

当我 Javascript 将 'finalresult' 写入我的网页时，它会按预期将视频 URL 作为文本写入网页。但是，当我尝试将其声明为 iframe 的源时，我最终在页面上看到了一个空白的 iframe。

有谁知道我的代码有什么问题，因为它没有在我的 iframe 中显示此视频？任何帮助将不胜感激。

Answer 1

您必须在触发任何特定 event 后更改 src。所以试试这个方法，

HTML :

<iframe id="mainvideo" width="720" height="480" frameborder="0" src="http://www.bing.com/" allowfullscreen></iframe>
<button id="changeSrc">Change iFrame</button>

javaScript :

var iframe = document.getElementById("mainvideo");

changeSrc.onclick = function(){
    iframe.src = "http://www.w3schools.com/";
};

jsFiddle

更新 1：

如果您想在页面加载后更改 iframe src 属性，请使用这种方式，

window.onload = function(){
    var iframe = document.getElementById("mainvideo");
    iframe.src = "http://www.w3schools.com/";
};

jsFiddle

Answer 2

如果 myframe.src 不适合您，请尝试 myframe.contentWindow.location.href，例如 in this pen。

无法使用 Javascript 更改 HTML iframe 源

Unable to change HTML iframe source with Javascript

javascript

html

iframe