![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
JavaScriptでランダムで画像を表示するスロットを作りたいのですが初心者ということで上手くいきません。
数字をランダムで表示することは出来たので、その部分を画像に置き換えようとしたのですがそこで動かなくなりました。
詳しい方いたら、どこをどう直せばいいのか教えてください。
画像ファイルはHTMLファイルと同じフォルダに入れており、それぞれ表示したい画像のフォルダ名は「(0~9までのいずれかの数字).png」です
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>スロット</title>
<script type="text/javascript">
spd=10; tID=0;
i=3; j=0; k=0;
m=0;
function start_slot(){
if (i>9){i=0;}
var i =Math.floor(Math.random 09 + 1);
document.write('<p><img scr="img/'+i+'png"></p>');
if (j>9){j=0;}
var j =Math.floor(Math.random 09 + 1);
document.write('<p><img scr="img/'+j+'png"></p>');
if (k>9){k=0;}
var k =Math.floor(Math.random 0*9 + 1);
document.write('<p><img scr="img/'+k+'png"></p>');
document.f.x.value=i; document.f.y.value=j; document.f.z.value=k;
if (m<1){ i++ ;}
if (m<2){ j++ ;}
if (m<3){ k++ ;}
tID=setTimeout("start_slot()", spd);
}
function stop_slot(){
if (m<3){m++; start_slot();}
if (m>2 && (i==j &&j==k)){ alert("やったね");}
clearTimeout(tID);
}
</script>
</head>
<body bgcolor="#191970" text="#ffffff">
<center>
<table border="3" bgcolor="#66cdaa"><tr><td>
<center>
<br><b>ROULETTE</b><br><br>
<form name="f">
<input name="x" size=1> <input name="y" size=1> <input name="z" size=1>
<br><br>
<input type="button" value="START" onClick="clearTimeout(tID); m=0; start_slot();">
<input type="button" value="STOP" onClick="stop_slot();">
</form><br>
</center>
</td></tr></table>
</center>
</body></html>
No.1ベストアンサー
- 回答日時:
<img> は document.write ではなく
HTML 内の <input> を置き換える様に記載
<input name="x" size=1>
→ <img id=x src=img/9.png>
random はなくてもよいが、目押し対策として入れたいならば
i++; if(i>9)i=0;
→ i = Math.random()*10|0;
書き換えるのは <input value> ではなく <img src>
例) document.f.x.value=i;
→ document.getElementById("x").src = "img/" + i + ".png";
回答ありがとうございます!
ご指摘していただいた個所を修正したのですが、自分の理解不足の点が多く上手く実行出来ず、どのように書き換えたらよいか教えていただけますでしょうか?
~略~
function start_slot(){
if (i>9){i=0;}
var i = Math.random()*10|0;
if (j>9){j=0;}
var j = Math.random()*10|0;
if (k>9){k=0;}
var k = Math.random()*10|0;
document.getElementsById("x").src = "img/" + i + ".png";
document.getElementsById("y").src = "img/" + j + ".png";
document.getElementsById("z").src = "img/" + k + ".png";
if (m<1){ i = Math.random()*10|0;}
if (m<2){ j = Math.random()*10|0;}
if (m<3){ k = Math.random()*10|0;}
tID=setTimeout("start_slot()", spd);
}
~略~
<form name="f">
<img id=x src=img/9.png> <img id=y src=img/8.png> <img id=z src=img/7.png>
<br><br>
<input type="button" value="START" onClick="clearTimeout(tID); m=0; start_slot();">
<input type="button" value="STOP" onClick="stop_slot();">
</form><br>
</center>
</td></tr></table>
</center>
</body></html>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- JavaScript HTMLでJavaScriptを使ってパスワードの強化判定のプログラムを作成しています。 一通り作っ 2 2022/10/19 01:41
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- PHP php ログイン 1 2022/11/01 00:24
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- PHP PHPで画像の渡しが上手く行きません。 1 2023/02/02 09:39
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
javascriptでhiddenに二次元配...
-
value内に変数を入れたい
-
selectboxのoptionタグのvalue...
-
Pythonで会員サイトの自動ログ...
-
テキストボックスに入力された...
-
[C#]連想配列の中に配列を入れたい
-
チェックボックスがundefinedと...
-
ラジオボタンの値取得
-
VB.NET DateTimeの型について
-
親ページのフォーム入力データ...
-
hiddenのvalueの値を変えたい
-
return trueとreturn falseの用...
-
onchangeイベントを強制的に発...
-
Selectボックスの幅を自動で広...
-
ボタン2回押しを無効にしたい
-
【jQuery】input nameの文字列...
-
プルダウン選択を変更すると、...
-
FormのonsubmitでJavaスクリプ...
-
javascriptでセレクトボックス...
-
ラジオボタンによるフォームの...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
value内に変数を入れたい
-
hiddenのvalueの値を変えたい
-
javascriptでhiddenに二次元配...
-
複数のsubmitボタンで押された...
-
テキストボックスに入力された...
-
switchを使って四則演算のプロ...
-
VB.NET DateTimeの型について
-
クイズ作成:15個の問題から5個...
-
C言語クイックソートの比較総回...
-
セレクトボックスの初期選択状...
-
ラジオボタンの選択で解答・点...
-
子から親へチェックボックスの...
-
ラジオボタンと連動して文字列...
-
setIntervalの間隔を途中で変更...
-
JAVASCRIPTで、ボタンを押した...
-
sessionStorageを調べています。
-
クリックの度に加算していくには?
-
マクロ オブジェクト変数With...
-
3桁区切りのカンマをつけたい...
-
selectboxのoptionタグのvalue...
おすすめ情報