• 締切済み

複数の<iframe>内にHTMLをランダム表示

以下のようなソースで、ランダムにHTMLをIFRAMEに読み込むソースを書いています。 (Javascript) window.onload = function(){ var c = 23; //ランダムに表示するiframe内URLの数 var ifm = document.getElementById('aaa');//frameIDを入力 var r = Math.floor( Math.random() * c ); var urls = new Array(); urls[0] = '../text/1.html'; urls[1] = '../text/2.html'; urls[2] = '../text/3.html'; urls[3] = '../text/4.html'; urls[4] = '../text/5.html'; urls[5] = '../text/6.html'; urls[6] = '../text/7.html'; urls[7] = '../text/8.html'; urls[8] = '../text/9.html'; urls[9] = '../text/10.html'; ifm.src = urls[r]; } (HTML) <iframe src="#" id="aaa" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> このような要領で、 id="aaa"にはtextフォルダ内のファイル1.html~10.htmlのうちからランダムで、 id="bbb"にはtextフォルダ内のファイル11.html~20.htmlのうちからランダムで、 id="ccc"にはtextフォルダ内のファイル21.html~30.htmlのうちからランダムで、 ・・・・ といった感じで以下のようなソースでそれぞれ読み込めればと思っているのですが、どうやったら可能でしょうか? <iframe src="#" id="aaa" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> <iframe src="#" id="bbb" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> <iframe src="#" id="ccc" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> javascriptにかんしてはあまり詳しくありませんので、ちょっと改変してコピペするくらいまでのソースを教えていただけませんでしょうか? よろしくおねがいします。

みんなの回答

  • LancerVII
  • ベストアンサー率51% (1060/2054)
回答No.1

こんにちは。 ファイル名が連番で3つのエリアに10個ずつなら機械的に出来ると思います。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <title>【OKWave回答サンプル集】複数の&lt;iframe&gt;内にHTMLをランダム表示</title> <link rel="stylesheet" href="/okwave/qa/css/basic.css" type="text/css" /> <script type="text/javascript"> window.onload = function() { for ( var i = 0; i < 3; i ++ ) { document.getElementById('ifr'+(i+1)).src = 'page.php?p=' + (Math.floor(Math.random()*10)+i*10+1); // document.getElementById('ifr'+(i+1)).src = // '../text/' + (Math.floor(Math.random()*10)+i*10+1) + '.html'; } } </script> <style type="text/css"> </style> </head> <body> <h1>複数の&lt;iframe&gt;内にHTMLをランダム表示(q7371262)</h1> <h2>サンプル</h2> <iframe src="blank.html" id="ifr1" frameborder="0" marginwidth="0" width="200" height="60"></iframe> <iframe src="blank.html" id="ifr2" frameborder="0" marginwidth="0" width="200" height="60"></iframe> <iframe src="blank.html" id="ifr3" frameborder="0" marginwidth="0" width="200" height="60"></iframe> </body> </html> <!-- q7371262 -->