javascript勉強中の65歳の初心者です
画像を乱数で得た座標に一定の時間で表示したいと次の通り試行錯誤していますが、どうも最初の1個は表示されますが配列の2番目以降表示されません。
初歩的な質問で恐縮ですがご指導お願いします。
<html>
<head>
<title>テスト表示</title>
</head>
<body onload= "set()">
<script language="JavaScript"><!--
sx = new Array();
sy = new Array();
num = 20;
var timer;
var n;
var i;
var m;
n = 0;
function set(){
for (m=0; m<num; m++) {
sx[m] = Math.floor(Math.random()*800);
sy[m] = Math.floor(Math.random()*600);
}
setInterval("uncohyouji()", 2000);
}
function uncohyouji(){
styl = "<img src='unco1.gif'style='position:absolute;";
document.write(styl+sx[n]+"px;left:"+sy[n]+"px;' name='unco1"+n+"'>");
n++;
}
No.2ベストアンサー
- 回答日時:
ソースを落として実験したら原因が分かりました。
uncohyouji()
で、document.write()
してますよね。
これは、ドキュメントを真っ白にして書き込むという命令なので、
真っ白にした瞬間に、スクリプトも消えてしまうわけです。
その証拠に、
uncohyouji()内で、
write()したあとに、
alert();
を書いて実行すると、
1回しか表示されません。
よって、writeは、使ってはいけないことになります。
回避策は2つあります。
ひとつは、
<img>に、id="img"という属性を書き、
document.getElementById('img').style.left=sy[n]+'px';
document.getElementById('img').style.top=sx[n]+'px';
とやるか、
document.body.innerHTML="<img src.....
とやるかのどちらかです。
参考URL:http://n.chu.in/1/click.html
nipox さん有難うございます。
document.writeの意味を理解せずにいました。
初歩的な質問に適切な回答を頂き感謝しています。
今後とも宜しくお願いします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript GoogleChart 階層ごとのブロックの長さを個別に設定したい 1 2022/07/06 14:27
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
window.openで値の渡し方を教え...
-
画像をランダムな座標に一定の...
-
JavaScriptを外部ファイルにす...
-
MAX関数を使ってからLEFT JOIN...
-
前回の質問の続き
-
jQueryスライドショー画像への...
-
画像の表示位置
-
JavaScript スライドの画像にリ...
-
ポップアップのソースの書き方...
-
デフォルト非表示にしたい。【t...
-
onclickとonmouseoverを同時に...
-
複数トリガーで動作するアコー...
-
背景色を透明化
-
バッチファイルでカウントアッ...
-
ホームページビルダー15 メニュ...
-
createElementが一瞬で消えてし...
-
タブで開いてさらにタブ内をア...
-
スライダーを実装した場合、ペ...
-
スマートフォンサイトに部分的...
-
jQueryで特定のURLの時のみ表示
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
window.openで値の渡し方を教え...
-
this.src等のthisについて
-
imgのsrcに値を設定するには
-
jQueryでサーバー上のファイル...
-
画像の座標位置取得
-
イベントハンドラを完全に外部...
-
連番画像「次へ」「前へ」で、...
-
画像の下に説明文をつけて切り...
-
JS switch文について
-
JavaScriptでリクエストを飛ば...
-
スマートな外部javaでロールオ...
-
JavaScriptでシンプルなスライ...
-
一定時間で画像とリンク先を変...
-
javascript 時計24時間表示
-
画像と文字を同時に切り替えたい
-
これはどんなJavaScriptなので...
-
Javaにて画像を残像が残りつつ...
-
FirefoxでonMouseOver/Outの動...
-
divの背景画像を、徐々に表示さ...
-
時間によって表示される画像を...
おすすめ情報