使用iframe时未定义函数

Question

我正在用javascript制作浏览器Web应用程序。奇怪的问题是，每当我在html中添加iframe标记时。javascript停止工作。

我的html:

<input type="text" id="input">
<button onclick="sean()"></button>
<iframe id="outp" src="about:blank"></iframe>

我的JS:

function sean(){
var input = document.getElementById('input').value;
var iframe = document.getElementById('outp')
iframe.src= "https://"+input
alert('worked');
};

有趣的是，只要我评论iframe标记(甚至没有修改js(，函数就会工作并显示警报消息，否则它会一直说sean没有定义。

如果需要，这里有一个笔显示错误：

https://codepen.io/ShazamBolt8/pen/yLpqeXZ

如果可能，请添加一个工作片段。

提前感谢：(

Answer 1

let input = document.getElementById("txt");
let btn = document.getElementById("btn");
let iframe = document.getElementById("ifr");
btn.addEventListener("click", () => {
iframe.src = "https://" + input.value;
alert("wo4ked");
});

<input id="txt" type="text" >
<button id="btn">GO</button>
<iframe id="ifr" src="about:blank" frameborder="10"></iframe>