掲示板/JavaScript質問板/過去ログ/一覧/ 画像が重複しない複数のランダム画像表示

0 名前： togenoko ： 2007/04/04（水） 10:58 ID:EhpnbSKP sub-Ax: javaはまったくの初心者です。
どうか助けてください。

画像のランダム表示を複数つくり、それぞれの画像が重複しないようにしたいのですが・・・

例
１箇所目　表示したい画像：A,B,C,Dから１つ
２箇所目　表示したい画像：A,B,C,Dから１つ
（１箇所目と２箇所目は横に並んでいます。）

そして、できれば同時に、それぞれの画像に固有のリンクをつけて、
リンク先を同じページでひらくように（htmlだとtarget="_top"）したいのですが。

どなたか解決方法があればご教授下さい。
よろしくお願いします。

1 名前： JAB ： 2007/04/04（水） 10:58 ID:GwG/RYrV sub-gm

javaではないので間違わないように。
下記はサンプルです。
少しややこしくなりましたが実行可能です。
変更するのは上の方のアドレスです。
上の列が画像のURL
下の列がリンク先のURL
で、上下一組になっています。

<body onload="ok();">
<SCRIPT language="javascript">
<!--
var img=new Array("link.gif","link2.gif","link3.gif");
var u=new Array("http://1.com/","http://2.com/","http://3.com/");

function ok(){
urli1=img[Math.floor(Math.random()*img.length);
urli2=img[Math.floor(Math.random()*img.length);
if(urli1==urli2){ok();}
else{document.write('<a href="'+u[urli1]+'"><IMG SRC="'+img[urli1]+'">');
document.write('<a href="'+u[urli2]+'"><IMG SRC="'+img[urli2]+'">');}
}
//-->
</SCRIPT>

おそらく、もっと簡略化できそうですが、私は正規の書き方等にこだわらないので…

2 名前：匿名： 2007/04/04（水） 10:58 ID:1dAdgEna sub-kJ

<script type="text/javascript">

(function () {
    var I = arguments.length;
    var i = 0;
    while (i < I) {
        var data = arguments[i++];
        var image = document.images[data[0][0]];
        image.parentNode.href = data[0][1];
        image.src = data[1][ Math.floor( Math.random() * data[1].length) ];
    }
} )

(
    [ [ 'imageID1', 'http://example.com/A.html' ], [ 'a1.png', 'a2.png', 'a3.png' ] ],
    [ [ 'imageID2', 'http://example.com/B.html' ], [ 'b1.png', 'b2.png', 'b3.png' ] ]
);
</script>

3 名前： togenoko ： 2007/04/04（水） 10:58 ID:EhpnbSKP sub-Ax: 早速のご返答ありがとうございます。

JABさんのを試してみたのですが、どうもうまくいきませんでした。

4 名前： JAB ： 2007/04/04（水） 10:58 ID:I3g1/Vn. sub-gm

多少修正してみました。お試しください。

<body onload="ok();">
<script language="javascript">
<!--
var img=new Array("link.gif","link2.gif","link3.gif");
var u=new Array("http://1.com/","http://2.com/","http://3.com/");

function ok(){
urli1=img[Math.floor(Math.random()*img.length);
urli2=img[Math.floor(Math.random()*img.length);
if(urli1==urli2){ok();}
}
ok();
document.write('<a href="'+u[urli1]+'"><IMG SRC="'+img[urli1]+'">');
document.write('<a href="'+u[urli2]+'"><IMG SRC="'+img[urli2]+'">');

//--></script>

5 名前：匿名： 2007/04/04（水） 10:58 ID:1dAdgEna sub-kJ: 致命的：
- onloadでdocument.writeしちゃ駄目。

文法ミス：
- a要素閉じ忘れ。
- langugae属性は不可。
- alt属性を忘れずに。

6 名前： NullPo ： 2007/04/04（水） 10:58 ID:yHkAvB4J sub-.G: >>0
>>2のプログラムが普通に動きましたよ。
IEでも、FireFoxとかOperaとかでも動く。
>>3で華麗にスルーしているけど、一体なぜでしょう。

>>4
致命的：
ok関数1行目及び2行目。
img[... 終わりの]がない。

どうみてもバグ：
urli1及びurli2の変数に代入されるのは画像の名称。
なので下のdocument.writeのu及びimgは常にundefined。

>>5
よくよく見るとonloadしたあとdocument.writeしているわけではないようです。
onloadイベントは意味がないから削除しよう。というレベル。

7 名前： JAB ： 2007/04/04（水） 10:58 ID:I3g1/Vn. sub-gm

確かにお指しの通り、間違いだらけですみません。
>>2のスクリプトを使用すれば良いと思いますが、後引きが悪いので修正します。
img[ はタイプミスでした。
</a>　は書き忘れました。

<script type="text/javascript"><!--
var img=new Array("link.gif","link2.gif","link3.gif");
var u=new Array("http://1.com/","http://2.com/","http://3.com/");

ok();
document.write('<a href="'+u[urli1]+'" target="_top"><img src="'+img[urli1]+'" alt="'+img[urli1]+'" border="0"></a>');
document.write('<a href="'+u[urli2]+'" target="_top"><img src="'+img[urli2]+'" alt="'+img[urli2]+'" border="0"></a>');

function ok(){
urli1=Math.floor(Math.random()*img.length);
urli2=Math.floor(Math.random()*img.length);
if(urli1==urli2)ok();
}
//--></script>

こんな感じでよろしいでしょうか?

8 名前： togenoko ： 2007/04/04（水） 10:58 ID:EhpnbSKP sub-Ax: うまくいきました！
みなさん、ありがとうございます。

特にJABさん、ありがとうございました！

9 名前： ともりん ： 2007/04/04（水） 10:58 ID:iwVIsFCS sub-t1: 突然すみません！

上記は探していたスクリプトだったのですが、
もう少しカスタマイズしたいのです。

そこで質問なのですが、
上のスクリプトを応用して
2つ以上の画像をランダムに
表示するにはどうしたらいいでしょうか？

7つの画像を同じものが
ダブって表示しないように
したいのです。

<script type="text/javascript"></script>

これだと同じものが同時に
表示されてしまうので、

if(urli1==urli2)ok();

この箇所でしょうか？
だぶらないように指定する
スクリプトはわかりますか？？？

宜しくお願い申し上げます。