ボディオンロードイベントを使用する必要がありますが、サードパーティのJavaScriptライブラリがハイジャックしました

StackOverflow https://stackoverflow.com/questions/1704010

質問

私はSimileを使用してダイナミックなタイムラインを描画しています。また、社内ライブラリを使用してコメントブログを追加しています。社内ライブラリは、Body ElementのOnloadイベントを使用して初期化します。

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

しかし、Simileは独自の目的のためにオンロードをハイジャックしたように見えます。

Simileコードを変更する以外に、どのようにして初期化を実行させることができますか？

問題を解決するためだけに、別のライブラリ（すなわちjQuery）を追加したくありません。

役に立ちましたか？

解決

jquery'sを使用してください $(document).ready 任意の数のハンドラーを追加できるイベント（とは異なります onload).

他のヒント

まず、一般的なルールとして、HTMLにJavaScriptをタグ属性として埋め込むことから離れたいと考えています。

第二に、直mileは上書きしている可能性があります onload （あなたと同じようにそれを使用します）。したがって、直mileを含めた後、オンロードイベントを追加したいと思うでしょう。

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>

jqueryを追加して使用します

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

これをjqueryで書く方法はいくつかありますが、これは最も説明的なことです。

あなたが何らかの種類のJavaScript開発をしているなら、あなたは 必要 jQueryを見ている。それは完全に甘いです！

前述の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'));

ハイジャックすることにより、コードと上書きの後に直mile負荷をかけます onload？その場合、あなたがそれの後ろにいることを確認してください（ジャスティンとして 言う）、そしてあなたがそれを自分で上書きする前に、の価値を保存します onload どこかで、それはまだ（あなた自身のハンドラーから）呼ばれます。

つまり、JQueryを使用しない場合です。

ここを見ると、JQueryが使用するもの、私が信じている、またはそれを変更するソリューションが表示されますが、それはあなたのニーズに合わせて機能するはずです。

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

最後の行がコメントアウトされていることがわかります。それはあなたがそれらをclobberし（concomment）か、あなたのコードが実行されないかのいずれかを獲得した場合には、これは主要なブラウザで機能します。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top