今天修改客户网站时遇到一个奇怪的问题,情况如下:
用JavaScript动态生成一个浮动层浮动层内嵌一个<iframe>标签显示相关内容,页面载入后显示,一分钟后自动消失,一分钟后再次出现。但是奇怪的问题出现了,每次页面载入后,IE浏览器弹出信息框提示“internet explorer 无法打开 internet 站点”的提示。运行的JavaScript如下:
var flying;
Creatimg_div();
function Creatimg_div()
{
if (document.readyState!="complete") return ;
var span = document.createElement('span');
span.setAttribute('id','haha');
span.innerHTML = '<DIV id="followDiv2" style="Z-INDEX: 10; POSITION: absolute; width:80px; height:60px;left:450;top:300"><iframe name="book" src="index_image.asp" frameborder="0" width="124" height="188" scrolling="no"></iframe></DIV>';
document.body.appendChild(span);
flying = setInterval('fly()',1);
setTimeout('Close_div()',60000);
}
function Close_div() {
var div = document.getElementById('haha');
div.parentNode.removeChild(div);
clearInterval(flying);
setTimeout('Creatimg_div()',60000);
}
function fly()
{
var followObj = document.getElementById('followDiv2');
var x = document.body.clientWidth-600;
var y = document.body.clientHeight-400;;
var followObj_x = (typeof(x) == 'string' ? eval(x): x );
var followObj_y = (typeof(y) == 'string' ? eval(y): y );
if(followObj.offsetLeft!=(document.body.scrollLeft+followObj_x) ) {
var dx = (document.body.scrollLeft + followObj_x-followObj.offsetLeft)*delta;
dx = (dx>0?1:-1) * Math.ceil(Math.abs(dx));
followObj.style.left=followObj.offsetLeft+dx;
}
if(followObj.offsetTop!=(document.body.scrollTop + followObj_y)) {
var dy = (document.body.scrollTop+followObj_y - followObj.offsetTop)*delta;
dy = (dy>0?1:-1) * Math.ceil(Math.abs(dy));
followObj.style.top = followObj.offsetTop + dy;
}
}
经过检查,脚本完全无错,但是每次页面载入都是报错,让我百思不得其解。参考相关资料后我得出以下结论:在页面载入时运行这段脚本生成了一个<iframe ,但是页面并没有完全载入完成就开始解析<iframe ,<iframe 还没引发完成就跳转,导致游览器中断,所以就出现了 “internet explore 无法打开internet站点...,已终止操作”的结果。
文件原因找到了,解决的方法也很简单:
延缓调用生成浮动层的函数,这样可以等待页面载入完毕后再生成<iframe,这样就可以避免导致浏览器解析中断。
代码修改:
将直接运行
Creatimg_div()
修改为
setTimeout('Creatimg_div()',1500);
用setTimeout延时1.5秒启动函数即可。
标签: JavaScript iframe 错误