コードをスマートにさせたい。

jQueryとPHPを使い、画面遷移せずに回すクリックカウンター
http://1bit.mobi/20110112164331.html

現在、上記のカウンターを2つ並べています。
この01,02の数字を変数にして指定回数ループで回してコードがスッキリさせたいのですが、
うまくいきませんでした。どのように修正したらよいでしょうか？
http://olo.sakura.ne.jp/test/test.html

jQuery(document).ready(function(){
//初期時のカウンターファイル読み込み
var randnum1 = Math.floor( Math.random() * 10000 );
jQuery("#btn01 span").load("count/count01.txt?r=" + randnum1);
jQuery("#btn02 span").load("count/count02.txt?r=" + randnum1);
//カウンター追加後の読み込み関数
function func01(data){
var randnum1 = Math.floor( Math.random() * 10000 );
jQuery("#btn01 span").load("count/count01.txt?r=" + randnum1);
}
function func02(data){
var randnum1 = Math.floor( Math.random() * 10000 );
jQuery("#btn02 span").load("count/count02.txt?r=" + randnum1);
}
//カウンター＋1追加処理
jQuery('#btn01 p').click(function(e){
//「param1」変数の値と書き込みファイル名の情報をもってpost.phpへ。その後、関数func01を実行
jQuery.post("count/post.php" , {"param1": 'count01.txt'} , func01);
});
jQuery('#btn02 p').click(function(e){
//「param1」変数の値と書き込みファイル名の情報をもってpost.phpへ。その後、関数func02を実行
jQuery.post("count/post.php" , {"param1": 'count02.txt'} , func02);
});
});

No.1 ベストアンサー 回答者： fujillin 回答日時： 2011/07/07 15:55

回答がないみたいなので…

テスト環境がないので雰囲気のみですが、こんな感じ？
（対象が2個だけなので、ほとんど短くもスマートにもなっていませんが…）
全角空白は半角に

//　カウンター読込み（表示）
function load(n){
　var uri = "count/count0" + n + ".txt?r=" + Math.floor(Math.random() * 10000);
　jQuery("#btn0" + n + " span").load(uri);
}

//　初期表示＋イベント設定
for(var n=0; ++n<3;){
　load(n);
　jQuery("#btn0" + n + " p").click(
　　(function(m){
　　　return function(){
　　　　jQuery.post("count/post.php", {"param1":"count0" + m + ".txt"}, function(){load(m);});
　　　};
　　})(n)
　);
}

*テストしていませんので、タイポなどありましたらご容赦。

この回答へのお礼

すばらしい！
修正なしでそのままコードを適用できました！
http://olo.sakura.ne.jp/test/test.html

10個以上カウンターを設置したかったのでコードが10分の1で済みます。
ありがとうございましたm(＿)m
ループの使い方も勉強させていただきます。

お礼日時：2011/07/07 16:59