Ajaxでファイルを組み込むプラグイン(その2)

Ajaxでファイルを読み込むプラグインでは、読み込むファイルにscriptタグが含まれていると、そのJavaScriptは動作しません。
ただし、一部のJavaScriptは、動作させることができる場合があります。
その方法を解説します。

1.動作させることができるJavaScript

動作させることができるJavaScriptは、以下のような条件を満たしている必要があります。

  • JavaScriptのコードがHTMLに直接に書かれている(src属性でJavaScriptを組み込まない)
  • document.writeメソッドを使っていない

2.HTMLからJavaScriptを削除

まず、組み込みたいHTMLから、JavaScript(<script・・・>~</script>)の部分を切り取ります。
切り取ったJavaScriptは、メモ帳等に貼り付けておきます。

3.MTAjaxIncludeタグの書き換え

次に、MTAjaxIncludeタグを、以下のように書き換えます。
「変数名」には、英単語で適当な変数名をつけてください(例:「js1」など)。
また、「実行したいJavaScriptのコード」には、scriptタグの内側のJavaScriptのみを記述します(scriptタグは入れません)。

<MTSetVarBlock name="変数名">
実行したいJavaScriptのコード
</MTSetVarBlock>
<MTAjaxInclude id="ID" js="$変数名">読み込むファイル名</MTAjaxInclude>

例えば、ファイルを読み込んで、その内容を「foo」というdiv要素に流し込むとします。
また、その内容(innerHTML)をalertでポップアップ表示したいとします。
この場合、以下のようにタグを組みます。

<MTSetVarBlock name="js1">
var fooObj = document.getElementById('foo');
alert(fooObj.innerHTML);
</MTSetVarBlock>
<MTAjaxInclude id="foo" js="$js1">読み込むファイル名</MTAjaxInclude>

4.注意事項

JavaScriptを動作させる手順は、おおむね上記のようになります。
しかし、すべてのJavaScriptを動作させられるという保障はありません。
複雑なJavaScriptの場合、動作しないこともありえます。

MT Cloud Starter Kit
Movable Typeのプラグイン集「MT Cloud Starter Kit」をぜひご利用ください