如何检测是否已加载iframe？
我正在尝试检查用户单击按钮后是否已加载iframe。
我有
$('#MainPopupIframe').load(function(){
console.log('load the iframe')
//the console won't show anything even if the iframe is loaded.
})
的HTML
<button id='click'>click me</button>
//the iframe is created after the user clicks the button.
<iframe id='MainPopupIframe' src='http://...' />...</iframe>
有什么建议么？
顺便说一下，我的iframe是动态创建的。它不会随初始页面加载一起加载。
问题答案：
您可以尝试使用（jQuery）
$(function(){
$('#MainPopupIframe').load(function(){
$(this).show();
console.log('iframe loaded successfully')
});
$('#click').on('click', function(){
$('#MainPopupIframe').attr('src', 'https://heera.it');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id='click'>click me</button>
<iframe style="display:none" id='MainPopupIframe' src='' /></iframe>
更新： 使用普通格式javascript
window.onload=function(){
var ifr=document.getElementById('MainPopupIframe');
ifr.onload=function(){
this.style.display='block';
console.log('laod the iframe')
};
var btn=document.getElementById('click');
btn.onclick=function(){
ifr.src='https://heera.it';
};
};
<button id='click'>click me</button>
<iframe style="display:none" id='MainPopupIframe' src='' /></iframe>
更新： 您也可以尝试一下（动态iframe）
$(function(){
$('#click').on('click', function(){
var ifr=$('<iframe/>', {
id:'MainPopupIframe',
src:'https://heera.it',
style:'display:none;width:320px;height:400px',
load:function(){
$(this).show();
alert('iframe loaded !');
}
});
$('body').append(ifr);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id='click'>click me</button><br />
-
我正在尝试检查用户单击按钮后是否加载了iframe。 我有 顺便说一下，我的iframe是动态创建的。它不会与初始页面加载一起加载。
-
问题内容： 我想在文档加载后调用一个函数，但是文档可能尚未加载完成，也可能尚未加载完成。如果确实加载，那么我可以调用该函数。如果未加载，则可以附加事件监听器。在onload已经触发之后，我无法添加事件监听器，因为它不会被调用。那么如何检查文档是否已加载？我尝试了下面的代码，但不能完全正常工作。有任何想法吗？ 问题答案： 不需要galambalazs提到的所有代码。在纯JavaScript中实现跨浏
-
问题内容： 加载JavaScript文件时是否会触发事件？由于YSlow建议将JavaScript文件移动到页面底部，因此出现了问题。这意味着 在加载包含其代码的js文件之前会触发该事件。 如何避免这种情况？ 问题答案： 我没有方便的参考，但是脚本标记是按顺序处理的，因此，如果将脚本标记放在定义function1等的脚本标记之后，则应该可以。 当然，另一种方法是通过在构建过程中合并文件来确保总共只
-
我正在为我的网站创建一个打印页面：http://vivule.ee/0/print 我希望在页面加载后启动。我尝试过不同的方法，但都不成功。我知道这是可能的，因为我可以监听完成的Ajax调用，但在Angular中是如何实现的？
-
问题内容： 我试图检测我的sprite节点是否已被触摸并且我不知道从哪里开始。 问题答案： 首先将的属性设置为字符串。 然后在功能上 这是一种方法。 您也可以继承并覆盖其中的内部。 然后做
-
问题内容： 有谁知道如何检查jquery是否已加载（使用javascript），然后再加载（如果未加载）。 就像是 问题答案： 也许是这样的：