需要使用body onload事件，但是第三方JavaScript库已经劫持了它

发布于 2024-08-10 19:54:50 字数 303 浏览 10 评论 0原文

我正在使用 Simile 来绘制动态时间线。我还使用内部库来添加评论博客。我们的内部库使用 body 元素的 onload 事件进行初始化。

<body onload="initComments('myID')">

但 Simile 似乎出于自己的目的劫持了 onload，因此 initComments('myID') 永远不会执行。

如果不更改 Simile 代码，我怎样才能让我的初始化程序运行？

我不想只是为了解决问题而添加另一个库（即 jQuery）。

原文

I'm using Simile to draw dynamic timelines. I am also using an in-house library to add a comment blog. Our in-house library uses the body element's onload event to initialize.

<body onload="initComments('myID')">

But Simile seems to have hijacked the onload for their own purpose so that initComments('myID') never executes.

Short of changing the Simile code, how could I get my initializer to run?

I would prefer not to add another library (i.e. jQuery) just to solve the problem.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

吐个泡泡 2024-08-17 19:54:50

首先，作为一般规则，您希望避免将 JavaScript 作为标记属性嵌入到 HTML 中。

其次，Simile 可能会覆盖 onload （使用它的方式与您相同）。因此，在包含 Simile 后，您需要添加 onload 事件。

使用 jQuery：

<script src="/js/blah/simile.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        initComments('myID');
    });
</script>

不使用库（在此处找到）：

<script src="/js/blah/simile.js" type="text/javascript"></script>
<script type="text/javascript">
  function addOnloadEvent(fnc){
    if ( window.addEventListener ) {
      window.addEventListener( "load", fnc, false );
    } else if ( window.attachEvent ) {
      window.attachEvent( "onload", fnc );
    }
    else {
      var oldOnload = window.onload || function() {};
      window.onload = function(e) {
        oldOnload(e);
        window[fnc](e);
      };
    }
  }

  addOnloadEvent(function() { initComments('myID'); });
</script>

First off, as a general rule, you want to stay away from embedding JavaScript in your HTML as tag attributes.

Secondly, Simile is likely overwriting the onload (using it the same way you are). So, you'll want to add your onload event after you've included Simile.

Using jQuery:

<script src="/js/blah/simile.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        initComments('myID');
    });
</script>

Using no library (found here):

<script src="/js/blah/simile.js" type="text/javascript"></script>
<script type="text/javascript">
  function addOnloadEvent(fnc){
    if ( window.addEventListener ) {
      window.addEventListener( "load", fnc, false );
    } else if ( window.attachEvent ) {
      window.attachEvent( "onload", fnc );
    }
    else {
      var oldOnload = window.onload || function() {};
      window.onload = function(e) {
        oldOnload(e);
        window[fnc](e);
      };
    }
  }

  addOnloadEvent(function() { initComments('myID'); });
</script>

回复收藏 0 原文

秋风の叶未落 2024-08-17 19:54:50

使用 jQuery 的 $(document).ready 事件，该事件允许您添加任意数量的处理程序（与 onload 不同）。

回复收藏 0 原文

各自安好 2024-08-17 19:54:50

添加 jQuery 并使用

$(document).ready(function(){
  // Your code here...
});

在 jQuery 中还有其他几种编写方法，但我发现这是最具解释性的。

如果您正在进行任何类型的 JavaScript 开发，您需要考虑 jQuery。真是太甜了！

Add in jQuery and use

$(document).ready(function(){
  // Your code here...
});

There are a couple of other ways to write this in jQuery, but I find this is the most explanatory.

If you're doing any kind of JavaScript development, you need to be looking at jQuery. It's totally sweet!

回复收藏 0 原文

美煞众生 2024-08-17 19:54:50

除了前面提到的 jQuery 解决方案（但是我强烈建议使用它，它很棒）之外，这里是普通的 JS 解决方案（因为您在问题中没有提到任何有关 jQuery 的内容）：

// Add this to top of your script.
window.onload = function () {
    for (var i = 0; arguments.callee.functions.length > i; i++) {
        arguments.callee.functions[i]();
    }
};
window.onload.functions = [];

// Now for every onload function you want to add, do:
window.onload.functions.push(initComments('myID'));

Apart from the aforementioned jQuery solution (I however highly recommend to use it, it's great) here's the plain vanilla JS solution (as you didn't mention anything about jQuery in your question):

// Add this to top of your script.
window.onload = function () {
    for (var i = 0; arguments.callee.functions.length > i; i++) {
        arguments.callee.functions[i]();
    }
};
window.onload.functions = [];

// Now for every onload function you want to add, do:
window.onload.functions.push(initComments('myID'));

回复收藏 0 原文

韵柒 2024-08-17 19:54:50

所谓劫持，您的意思是 Simile 在您的代码之后加载并覆盖 onload？在这种情况下，请确保您支持它（如 Justin 说），在你自己覆盖它之前，将 onload 的值存储在某个地方，这样它仍然会被调用（从你自己的处理程序）。

也就是说，如果您不使用 jQuery。

回复收藏 0 原文

初雪 2024-08-17 19:54:50

如果你看这里，你会看到 jQuery 使用的解决方案，我相信，或者它的修改，但它应该可以满足你的需求。

http://dean.edwards.name/weblog/2006/06/again/< /a>

// 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
};

/* 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; */

你会看到最后一行被注释掉了。如果事情发展到这一步，要么你会破坏它们（取消注释），要么你的代码将无法运行，但这适用于主要浏览器。

If you look here you will see a solution that is what jQuery uses, I believe, or a modification of it, but it should work for your needs.

http://dean.edwards.name/weblog/2006/06/again/

// 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
};

/* 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; */

You will see that the last line is commented out. In the event it gets that far either you will clobber them (uncomment) or your code won't run, but this will work for the major browsers.

回复收藏 0 原文

~没有更多了~