浏览 6403 次
|
锁定老帖子 主题：script.onload 事件
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-07-07
如果你执行以下代码会出现什么情况？ <html><head><script type="text/javascript">document.write("<script type=\"text/javascript\" src=\"http://dhtmlkitchen.com/editor/js/drag.js\"><\/script><script type=\"text/javascript\">alert(\"Listener.cleanUp (nested):\" + Listener.cleanUp)<\/script>");</script></head><body/></html>
在IE浏览器里面，它会告诉你Listener为定义，为什么？因为，在IE里面它会先执行alert(...同时加载drag.js。当它执行 Listener.cleanUp 的时候drag.js还没有load完，这个时候Listener当然未定义。
怎么解决这个问题呢？要是script有个onload事件就好了，事实上在FF里面script的确有个onload事件（实际上FF比较聪明一点，如果Listener为定义，它会等等看看drag.js里面有没有定义，所以在FF里面不会说Listener为定义），但是在IE里面没有直接定义这个事件，所以要变通一下： <script>
function loadScript(src, callback) {
var script = document.createElement("script");
if(script.addEventListener)
script.addEventListener("load", callback, false);
else if(script.attachEvent)
script.attachEvent("onreadystatechange",
function() { loadScript.callbackIE(callback); });
script.src = src;
document.getElementsByTagName("head")[0].appendChild(script);
}
loadScript.callbackIE = function(callback) {
var target = window.event.srcElement;
if(target.readyState == "loaded")
callback.call(target);
};
// load 30k script.
// Listener.cleanUp is defined at the bottom of drag.js
callback = function() {
var self = this;
alert("Loaded: " + this.src + "\nListener.cleanUp (nested):" + Listener.cleanUp);
};
loadScript("http://dhtmlkitchen.com/editor/js/drag.js", callback);
</script>
在IE里面应该用：onreadystatechange事件，现在在运行一下新的代码，看看是不是可以了？
以上代码在FF,IE6,IE7下测试通过。
代码引用自：http://codingforums.com/archive/index.php?t-85692.html
注意这个帖子里面最后有位仁兄"KC-Luck"写了一个简化的版本，实际上在IE里面是无效的（可能是因为他用了"complete"事件的缘故） 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-07-09
跟HTML的onload一样吗？？？
|
| 返回顶楼 | |
|
发表时间：2008-08-02
感觉可以用一下mootools中的domready，这样就不会出现页面还没有加载完的情况了
|
| 返回顶楼 | |
|
发表时间：2008-08-04
mootools中的domready好像不能针对某一个DOM元素是否载入完成做判断？
我没有试过，不过看他的代码好像是这样的 楼主的这种onload方法感觉还是靠谱一点儿，可以适合于任何DOM元素的载入判断 |
| 返回顶楼 | |
