各フォルダから1枚ずつ画像をランダム表示

質問

画像のランダム表示なのですが、

index.html
├[001]…0.gif～10.gif
├[002]…0.gif～9.gif
└[003]…0.gif～20.gif

001～003はそれぞれの画像が入ったフォルダです。ファイル名は0から順にナンバリングしてます。

index.html内の各所にそれぞれのフォルダからの画像をランダムで表示したいです。つまり

【001内の画像】【002内の画像】【003内の画像】

こんな感じです。（わかりにくいですねスミマセン）

多分ひとつのフォルダごとにそれぞれコードを記述すればできるのはわかるのですが、どうせ同じことをさせるコードなら一つにまとめれるのではないかと考えました。

いろいろ考えたのですが
*フォルダごとの画像数が違う場合、全ての画像を拾うためにはどうすればいいか
*フォルダ名を引数？値？にしてjsに渡してやる？？？
行き詰まりましたw

これからフォルダが増えればまたコードが増えるというのは避けたいので、すっきりとまとまるコードがないものか考え中なのですが・・・どうにもこうにもうまく作れません（汗）

以上、参考となるサイトでも結構です。アドバイスよろしくお願い致します。

回答No.1

karumakaruma · ベストアンサー

ファイルを連番にするなら、数字の最大値を配列に
持たせて、それをランダムで表示するというのは
どうでしょうか。

＃設定部
<SCRIPT Language=JavaScript>
<!--
var flist = new Array();
// 各フォルダの最大画像番号を配列に入れる
flist['001'] = 10;
flist['002'] = 9;
flist['003'] = 20;

function image_view(folder) {
//y=random(x) の時 0<=y<x なので1を足しておく
rd = Math.floor(Math.random()*(flist[folder]+1));
//画像表示
document.write("<IMG SRC=\"" + folder + "/" + rd + ".gif\">" );
}
//-->
</SCRIPT>

＃表示部
<SCRIPT LANGUAGE="JavaScript">
<!--
for(xx in flist ){
image_view(xx);
}
//-->
</SCRIPT>

これだと、配列さえ変えればいくらでも表示させる
事ができますから、配列の設定を外部JavaScriptに
しておけば、htmlファイル自体は触らなくてよくなります。