テキストファイルの内容を変数に格納したい

$(function() {
$item = "";
$.ajax({
url: 'data/data.txt',
success: function($data) {
$item = $data;
}
});
alert($item);
});

上記のように外部のテキストファイルを読み込んで、その中身の文字列をajaxの外で宣言している変数に格納したいのですが、何も格納できていません。
テキストファイルのパスが間違っているということや、中身が何もないということはありません。
ajaxのsuccess内にalertを置いた場合は値が正しく表示されるのですが、ajaxの外ではやっぱだめです。
ajaxではなくloadでやろうとも思ったのですが、loadの場合はHTML上のタグにしか出力できないので、今回の目的には合いません。
なんとかして、変数にテキストファイルの中身を渡せないのでしょうか。

No.1 ベストアンサー 回答者： hitomura 回答日時： 2014/07/08 00:53

デフォルトでは ajax() は指定されたデータに基づきファイルを非同期に読み込みます。

この「非同期に」というところがミソで、これは要するに読み込み処理を現在の処理とは別の流れで行います。そのとき現在の処理は ajax() を行った箇所以降を即時に実行します。

現実世界にたとえるならあなたがやりたいのは、どこかに資料の郵送を要求してその資料が届かないうちにその資料を読みたいということです。どう考えても無理ですよね。
ですので、同期的に読み込むように指示する必要があります。

パラメータに
　async : false
を追加すれば ajax() は同期的にファイルを読み込むことになります。
ただし、上記の修正を行った場合は、ファイルの読み込みが終わるまでブラウザの操作ができなくなります。

この回答へのお礼

とても早いご回答ありがとうございます。助かりました。
例えが非常にわかりやすかったです。

お礼日時：2014/07/08 10:41

No.2 回答者： tracer 回答日時： 2014/07/08 02:53

結論から書くと、successの箇所でalertすれば、正常にalertされます。

少し説明が難しいですが、プラグラムは必ずしも上から下に実行されるわけではありません。
別の方も言われていますが、ajaxは非同期で行われるためです。
平たく言うと、読み込み後に行われるべき処理はすべてsuccessの中に書きなさいということになります。
たとえば、外部に関数を置いて、successの中ではそれらの関数を呼び出すだけ。というような使い方が考えられます。

ただ、処理が長くなると、複雑になり(ネストが深くなる)がちなので、jQueryの場合は、$.deferredというものを用いて、コードを扱いやすくします。この場での説明は冗長的になってしまうので、ご興味があれば、「jquery deferred」で使い方を検索してみてください。

この回答へのお礼

deferredというものも教えて頂き、ありがとうございます。
今回は単純な処理なので使うことはなさそうですが、複数の階層にまたがってしまいそうな処理を、並列に出来るってことですね。

お礼日時：2014/07/08 10:43