人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

外部jsファイルを読み込む為に以下のような記述をしました。

http://test.com/aaaa/test.jsの中身は単なる
alert(test_ok);
しか記述がないです。

aaa.jsの中身は

deferLoader('http://test.com/aaaa/test.js');
function deferLoader(filepath,callback){
var sc = document.createElement('script');
sc.setAttribute('defer', true);
sc.type = 'text/javascript';
window.external_script_onload = filepath;
sc.src = filepath;
document.body.appendChild(sc);
}

ただし、IE7で実行すると、上手く行きません。
ブラウザがすぐビジー状態になってしまう。

ついでに、window.external_script_onload
ってどういううごきなんですかね?

以下のページを参考にしているのですが
いまいちわかりません。

http://d.hatena.ne.jp/os0x/20080827/1219815828



●質問者: hopefully
●カテゴリ:就職・転職 ウェブ制作
✍キーワード:aaa BODY IE7 JavaScript js
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● mattn
●35ポイント

まずご理解されているかと思いますがexternal_script_onloadはid:os0xさんが決めた特定のコールバック名であって、windowオブジェクトに用意されたプロパティや関数ではありません。

実際に http://ss-o.net/js/callback_test.php にアクセスしてみると分かる通り、宣言されていれば外部からでもJSONP的に呼び出すよ!という仕組みでしかありません。

ちなみにexternal_script_onloadはcallbackを設定するのであって、filepathを指定する物ではありません。

※ビジー状態になっている原因は他にあるかと思います。

ですので、勝手にやりたいだろう事を推測させて頂くとすると

aaa.js

function deferLoader(filepath,callback){
 var sc = document.createElement('script');
 sc.setAttribute('defer', true);
 sc.type = 'text/javascript';
 window.external_script_onload = callback;
 sc.src = filepath;
 document.body.appendChild(sc);
}
deferLoader('http://test.com/aaaa/test.js', function(data) {
 alert(data); // loaded
});

test.js

alert('test ok');
if(typeof external_script_onload=='function')external_script_onload("loaded");

となります。元々は外部javascriptのロード完了を判断するのにid:amachangがタイマを使ってロードされたオブジェクトを監視していたのに対して、id:os0xさんが読み込み対象のスクリプトを少し弄ればロード完了イベントを受け取れるよ...と記事にした物かと思います。

私が一番良いんじゃないかな...と思ったのはid:os0xさんの記事にあるJavaScriptLoader

function JavaScriptLoader(src, callback){
var sc = document.createElement('script');
sc.type = 'text/javascript';
if (window.ActiveXObject) {
sc.onreadystatechange = function(){
if (sc.readyState == 'complete') callback(sc.readyState);
if (sc.readyState == 'loaded') callback(sc.readyState);
};
} else {
sc.onload = function(){
callback('onload');
};
}
sc.src = src;
document.body.appendChild(sc);
}

がクロスブラウザかつ読み込み対象を修正しなくて良いという点で一番利用価値があると思います。

◎質問者からの返答

JavaScriptLoaderを使ってみたのですが

IEだと、ページを中断しますみたいな

メッセージがあがってきてしまいます・・・

なんでだろう・・


2 ● mattn
●35ポイント

HTMLのドキュメントが読み込まれていない間にJavaScriptLoaderを呼び出した...という事はないですか?

ちなみに私の環境IE7だとうまく動いています。

<html>
<head>
<script type="text/javascript">
function JavaScriptLoader(src, callback){
var sc = document.createElement('script');
sc.type = 'text/javascript';
if (window.ActiveXObject) {
sc.onreadystatechange = function(){
if (sc.readyState == 'complete') callback(sc.readyState);
if (sc.readyState == 'loaded') callback(sc.readyState);
};
} else {
sc.onload = function(){
callback('onload');
};
}
sc.src = src;
document.body.appendChild(sc);
}

window.onload = function() {
JavaScriptLoader('foo.js', function() {
alert('foo.jsが読み込まれました。');
alert(window.foo); // hello world
});
}
</script>
</head>
</html>

foo.js

window.foo = "hello world";
◎質問者からの返答

window.onload = function() {

}

これだ・・

もっと詳細に提示しなくてすいません。

まず、AJAXでjsを使うHTMLをPHP側で、file_get_contentsします。

で、その後、その内容をinnerHTMLで返した後に、JSの中で

JavaScriptLoaderを実行しているので

読み込んだかどうかの判定が出来ないのかな・・

AJAX部分を一番下で実行すればいいんかな・

ちょっとやってみます。

色々、ありがとうございます。

最後に一点だけ教えて欲しいのですが、jsファイルを複数読み込みたい場合は

どうしたらいいでしょうかね?

srcの引き数を複数で、callbackはひとつにしたいのですが・・

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ