Nakajiman Software Blog: Later Plugin for jQuery ある処理の実行を後回しにできるプラグイン

2007-09-03

Later Plugin for jQuery ある処理の実行を後回しにできるプラグイン

Later Plugin for jQuery はメソッドチェーンの中で、ある処理の実行を後回しにできるプラグインです。

JSONP のコールバック関数の中で script 要素を削除すると IE がクラッシュしてしまう問題を jQuery 的に解決しようというのが動機です。

KoshigoeBLOG: 某所の"MochiKit.Async JSONP"を使わさせていただきました。

ロードのたびにユニークにしなければならなかったのは、script要素を削除している辺りにIEのバグが潜んでいたかららしいので、その辺を中心にtry&error。setTimeoutを使ってscript要素の削除を遅延させてみました。

↑Later Plugin for jQuery を作成するにあたり、上記のブログとそのリンク先を参考にさせてもらいました。

さらにいろいろ調べた結果、次の条件を満たすとき、script 要素を削除しようとすると IE がクラッシュすることがわかりました。

(1) file://... といった file プロトコルを使うとき
(2) ブラウザでキャッシュ済みのとき

いずれも Later Plugin for jQuery を使って script 要素の削除を遅らせることによって、うまく解決できています。

Later Plugin for jQuery ダウンロード

/*
 * Later Plugin for jQuery
 *
 * Copyright(C) 2007 LEARNING RESOURCE LAB.
 * http://developmentor.lrlab.to/postal/
 *
 * Dual licensed under the MIT (MIT-LICENSE.txt)
 * and GPL (GPL-LICENSE.txt) licenses.
 */
(function($) {
  
  // later
  $.fn.later = function(fn) {
    var self = this;
    var timer = setTimeout(function() {
      clearTimeout(timer);
      self.each(fn);
    }, 10);
    return self;
  };

})(jQuery); // function($)

次の例は div 要素の削除を後回しにしています。$.later メソッドで指定した関数は 10ms のタイムアウト後、実行されることになります。div 要素を script 要素に置き換えれば JSONP のコールバック関数の問題が解決できます。

<div id="r">foo</div>

<script type="text/javascript">
//<![CDATA[
jQuery(function($) {
  $('#r').later(function() {
    $(this).remove();
  });
});
//]]>
</script>

Later Plugin for jQuery は jQuery の振る舞いを理解する目的で作成したものですが、特定の場面でニーズがあるかもしれませんので公開します。ライセンスは jQuery と同じにしておきます。