Question

我正在使用流行的addLoadEvent来完成我所有的JS加载：

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent( locationToggle );
addLoadEvent( step1 );
addLoadEvent( step2 );
addLoadEvent( step3 );
addLoadEvent( getCounties );
addLoadEvent( mapSelection);

我读过的所有内容都表明这是避免上传冲突的一种相当防弹的方法。然而，这个方法似乎没有比在匿名window.onload函数中包装函数更好。这两种方法都会导致与这组函数发生相同的onload冲突。

我从与addLoadEvent函数本身相同的文件中加载这些函数。我也在使用calender.js这是第三方文件，它在另一个文件中使用mootools 1.2.4。我的文件没有Javascript。

首先，有人可以验证我没有损坏代码，我正确使用它。第二，有人可能会建议为什么以上不能解决冲突？

修改禁用所有其他Javascript文件时问题仍然存在。

Answer 1

你的代码很好。问题是，在 DOM 0方式中设置event handlers无法确保不会替换为其他代码。

您可以尝试新的W3C标准 addEventListener和IE版attachEvent，因为您附加的处理程序无法替换为第三方代码。

// window.onload W3C cross-browser with a fallback
function addLoadEvent(func) {
  if (window.addEventListener)
    window.addEventListener("load", func, false);
  else if (window.attachEvent)
    window.attachEvent("onload", func);
  else { // fallback
    var old = window.onload;
    window.onload = function() {
      if (old) old();
      func();
    };
  }
}

请注意，IE将以相反的顺序执行该功能，而不是按照添加顺序执行（如果这是一个问题）。

最后，我不知道你什么时候想运行你的代码，但如果你不想等待图片加载你可以提前执行你的功能然后是window.onload。 / p>

Dean Edwards有 nice script ，可以让您这样做。

通过此功能，您可以附加早期事件的功能： document.ready （DOMContentLoaded）

// document.ready
function addLoadEvent(func) {
  if (typeof func == "function") {
    addLoadEvent.queue.push(func);
  }
}
addLoadEvent.queue = [];

//////////////////////////////////////////////////////////////////////////////

// Dean Edwards/Matthias Miller/John Resig

function init() {
  // quit if this function has already been called
  if (arguments.callee.done) return;

  // flag this function so we don't do the same thing twice
  arguments.callee.done = true;

  // kill the timer
  if (_timer) clearInterval(_timer);

  // do stuff: execute the queue
  var que = addLoadEvent.queue;
  var len = que.length;
  for(var i = 0; i < len; i++) {
    if (typeof que[i] == "function") {
      que[i]();
    }
  }
};

/* for Mozilla/Opera9 */
if (document.addEventListener) {
  document.addEventListener("DOMContentLoaded", init, false);
}

/* for Internet Explorer */
/*@cc_on @*/
/*@if (@_win32)
  document.write("<script id=__ie_onload defer src=javascript:void(0)>"
                +"<\/script>");
  var script = document.getElementById("__ie_onload");
  script.onreadystatechange = function() {
    if (this.readyState == "complete") {
      init(); // call the onload handler
    }
  };
/*@end @*/

/* for Safari */
if (/WebKit/i.test(navigator.userAgent)) { // sniff
  var _timer = setInterval(function() {
    if (/loaded|complete/.test(document.readyState)) {
      init(); // call the onload handler
    }
  }, 10);
}

/* for other browsers */
window.onload = init;

注意：两种方法的用法与您的版本相同。

addLoadEvent无助于onload冲突

1 个答案: