这个javascript有什么理由不能在我的IFrame上更改"src"属性吗？

Question

所以我正在学习基本的html和javaScript（对不起，如果这是错误的主题），我正在尝试创建一个基本网站，其中用户输入网站URL，然后是一个iframe出现在该网站上。我是HTML的新手，所以这可能是愚蠢的，但我似乎找不到它是什么。令我感到困惑的是，该代码可以从该函数中起作用，尽管它立即活跃，因此无用。感谢您的帮助！

<iframe src="" name="myFrame" id="myFrame"></iframe>
<form onSubmit="setIframe()">
URL: <input type="text" name="urlbox" id="urlbox"> <input type="submit" value="go">
</form>
<script>
function setIframe()
    {
		var url = document.getElementById("urlbox").value;
		document.getElementById("myFrame").setAttribute("src","testwebsite.com");
    }
</script>

Answer 1

两件事：提交form通常会导致重新加载页面或重定向。为了防止这种情况，您可以致电event.preventDefault()。

另外，您不需要使用setAttribute，设置src就足够了。

function setIframe(event) {
  event.preventDefault();
  var url = document.getElementById("urlbox").value;
  document.getElementById("myFrame").src = "https://www.youtube.com/embed/q6EoRBvdVPQ";
}

<iframe src="" name="myFrame" id="myFrame"></iframe>
<form onsubmit="setIframe(event)">
  URL:
  <input type="text" name="urlbox" id="urlbox">
  <input type="submit" value="go">
</form>

jsbin上的示例。

请记住，许多站点都禁止将其页面嵌入iframe中。