質問のコードブロックは kei344 さんの指摘に従って直してください。
問題点は
- $.getは非同期で通信されるので、その結果を待たずにdocument.writeされてしまう。
- $.getのコールバック関数に持って行った場合、変数i,total状態はその結果を待たずにループによって変わるので、最初のdocument.writeで使うときに iやtotalはおもった値にならない。
2番目はスコープとかjavascriptのクロージャ(今回はちょっと違うかな)などでよく話題になる話ですが、
解決策としては、通信部分を別の関数にして変数のスコープをきっちり分けるという方法があります。
javascript
1function getUserImages(i){
2 var total = parseInt(i);
3 $.get("http://example.com/item/" + total + ".txt", function(data){
4 var name = data;
5 document.write('<li><div id="' + total + '" align="center"><a href=#' + ' title="' + name +
6 '" onclick="return users(this)"><img src="http://example.com/item/' + total +
7 '.jpg"></br></a><font size="1">' + name + '</font></div>');
8
9 });
10}
11
12for (i=1 ; i<=10 ; i++){
13 getUserImages(i);
14}
関数のなかでtotalをしっかり覚えてくれる(varがついていることが重要)、且つ1度の呼び出しの中でその値は変わらないので、$.getが終わった後もその値で処理できるという感じです。
他の解決策としては、$.getではなく、$.ajaxを使って同期処理オプションを有効にするという手もあります。
javascript
1 for (i=1 ; i<=10 ; i++){
2
3 var total = parseInt(i) ;
4
5 $.ajax({
6 url : "http://example.com/item/" + total + ".txt",
7 type : "get",
8 async: false,
9 success : function(data){
10 var name = data;
11 console.log(name);
12 document.write('<li><div id="' + i + '" align="center"><a href=#' + ' title="' + name +
13 '" onclick="return users(this)"><img src="http://hoge.hoge/item/' + total +
14 '.jpg"></br></a><font size="1">' + name + '</font></div>');
15 });
16 }
いずれも欠点があり、前者はサーバーの状況によっては順番が変わる可能性があり、後者は非同期の時より待たされてる感じがでるかもしれない事です。
後者はどうにもならないですが、前者に関してはdocument.writeを使っているのが問題の一端があるので、jQueryを使うなら、document.writeではなく、jQueryの機能であらかじめHTMLで用意しておいたli (idかclassでどのliか指定して)の中身を書き換える方法に改善するといいでしょう。