質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

1回答

3058閲覧

ナンバーズ10の作成

12345678910

総合スコア15

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2018/12/02 04:44

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
javascrioptでナンバーズのシステムを作っています。

問題文
USERの数値入力欄を10個作る。
コンピューターがランダムで数字を出力する機能をつくり、その欄を10個作る。
数字は1~9までの整数を使用。

途中経過
入力欄3つのナンバーズ3の問題があり、その問題はif文が作れたのですが、
同じことをナンバーズ10でやるとコードが長くなってしまいます。
一応ナンバーズ3の問題も載せておきます。
ナンバーズ10の解決策を考え中です。
何かよい方法はありますでしょうか?
ご教授宜しくお願いします。

該当のソースコード

javascript

//ナンバーズ3の問題
function click(){
click1=document.getElementById("click1");
number1=document.getElementById("number1").value;
number2=document.getElementById("number2").value;
number3=document.getElementById("number3").value;
user1=document.getElementById("user1");
user2=document.getElementById("user2");
user3=document.getElementById("user3");
com1=document.getElementById("com1");
com2=document.getElementById("com2");
com3=document.getElementById("com3");
var random1 = Math.floor( Math.random() * 3 ) + 0;
var random2 = Math.floor( Math.random() * 3 ) + 0;
var random3 = Math.floor( Math.random() * 3 ) + 0;
console.log("クリックできました。");
user1.innerHTML=number1;
user2.innerHTML=number2;
user3.innerHTML=number3;
com1.innerHTML=random1;
com2.innerHTML=random2;
com3.innerHTML=random3;

if(number1==random1 && number2==random2 && number3==random3){
kekka2.innerHTML="ストレート当選";}
else if(number1==random1 && number2==random3 && number3==random2 ||
number1==random2 && number2==random1 && number3==random3 ||
number1==random2 && number2==random3 && number3==random1 ||
number1==random3 && number2==random2 && number3==random1 ||
number1==random3 && number2==random1 && number3==random2) {
kekka2.innerHTML="ボックス当選";
}else{kekka2.innerHTML="はずれ";}
}//function click締め

function check1(){
click1=document.getElementById("click1");
number1=document.getElementById("number1").value;
number2=document.getElementById("number2").value;
number3=document.getElementById("number3").value;
if(number1.match(/^[0-9]{1}$/) && number2.match(/^[0-9]{1}$/) && number3.match(/^[0-9]{1}$/)){
click1.removeAttribute("disabled");
kekka1.innerHTML="入力完了";
}else if(number1=="" || number2=="" || number3==""){
click1.setAttribute("disabled","disabled");
}else{
kekka1.innerHTML="<span style='color: red;'>エラー</span>";
click1.setAttribute("disabled","disabled");
}
}//function check1の締め

//ここからナンバーズ10問題
console.log("総合課題5 ナンバーズ10");

 function button2(){
click2=document.getElementById("click2");
num1=document.getElementById("num1").value;
num2=document.getElementById("num2").value;
num3=document.getElementById("num3").value;
num4=document.getElementById("num4").value;
num5=document.getElementById("num5").value;
num6=document.getElementById("num6").value;
num7=document.getElementById("num7").value;
num8=document.getElementById("num8").value;
num9=document.getElementById("num9").value;
num10=document.getElementById("num10").value;
user1ban=document.getElementById("user1ban");
user2ban=document.getElementById("user2ban");
user3ban=document.getElementById("user3ban");
user4ban=document.getElementById("user4ban");
user5ban=document.getElementById("user5ban");
user6ban=document.getElementById("user6ban");
user7ban=document.getElementById("user7ban");
user8ban=document.getElementById("user8ban");
user9ban=document.getElementById("user9ban");
user10ban=document.getElementById("user10ban");
com1=document.getElementById("com1");
com2=document.getElementById("com2");
com3=document.getElementById("com3");
com4=document.getElementById("com4");
com5=document.getElementById("com5");
com6=document.getElementById("com6");
com7=document.getElementById("com7");
com8=document.getElementById("com8");
com9=document.getElementById("com9");
com10=document.getElementById("com10");

var random1ban = Math.floor( Math.random() * 3 ) + 0;
var random2ban = Math.floor( Math.random() * 3 ) + 0;
var random3ban = Math.floor( Math.random() * 3 ) + 0;
console.log("クリックできました。");
user1ban.innerHTML=num1;
user2ban.innerHTML=num2;
user3ban.innerHTML=num3;
com1ban.innerHTML=random1ban;
com2ban.innerHTML=random2ban;
com3ban.innerHTML=random3ban;

if(num1==random1ban && num2==random2ban && num3==random3ban &&
num4==random4ban && num5==random5ban &&
num6==random6ban && num7==random7ban && num8==random8ban &&
num9==random9ban && num10==random10ban){
kekka4.innerHTML="ストレート当選";}
else if(){
kekka4.innerHTML="ボックス当選";
}else{kekka4.innerHTML="はずれ";}
}//function click締め

function check2(){
click2=document.getElementById("click2");
num1=document.getElementById("num1").value;
num2=document.getElementById("num2").value;
num3=document.getElementById("num3").value;
if(num1.match(/^[0-9]{1}$/) && num2.match(/^[0-9]{1}$/) && num3.match(/^[0-9]{1}$/)){
click2.removeAttribute("disabled");
kekka3.innerHTML="入力完了";
}else if(num1=="" || num2=="" || num3==""){
click2.setAttribute("disabled","disabled");
}else{
kekka3.innerHTML="<span style='color: red;'>エラー</span>";
click2.setAttribute("disabled","disabled");
}
}//function check1の締め

<h1>総合課題5 ナンバーズ3</h1> <p>1.ユーザーが数値を入力した物とコンピュータが抽選した数値から当選結果を表示する<br> 2.番号が全て一致し番号の並び順番も一緒の場合→ストレート当選<br> 3.番号が全て一致→ボックス当選<br> 4.その他→ハズレ<br> ※ヒント、Mathクラス random()、配列、indexOf、push、splice、some</p> 入力欄:<input type="text" style="height:30px;width:150px;" id="number1" onblur="check1()" > <input type="text" style="height:30px;width:150px;" id="number2" onblur="check1()"> <input type="text" style="height:30px;width:150px;" id="number3" onblur="check1()"> <input type="button" value="当たっているかな" onclick="click()" id="click1"> <p id="kekka1"></p> USER :[<span id="user1">&emsp;&emsp;&emsp;</span>] [<span id="user2">&emsp;&emsp;&emsp;</span>] [<span id="user3">&emsp;&emsp;&emsp;</span>] <br> <br> COM : [<span id="com1">&emsp;&emsp;&emsp;</span>] [<span id="com2">&emsp;&emsp;&emsp;</span>] [<span id="com3">&emsp;&emsp;&emsp;</span>]<br> <p>当選結果</p><span id="kekka2"></span>

HTMLソースコード

<h1>総合課題5 ナンバーズ10</h1> <p>1.ユーザーが数値を入力した物とコンピュータが抽選した数値から当選結果を表示する<br> 2.番号が全て一致し番号の並び順番も一緒の場合→ストレート当選<br> 3.番号が全て一致→ボックス当選<br> 4.その他→ハズレ<br> ※ヒント、Mathクラス random()、配列、indexOf、push、splice、some</p> 入力欄:<input type="text" style="height:30px;width:70px;" id="num1" onblur="check2()" > <input type="text" style="height:30px;width:70px;" id="num2" onblur="check2()"> <input type="text" style="height:30px;width:70px;" id="num3" onblur="check2()"> <input type="text" style="height:30px;width:70px;" id="num4" onblur="check2()" > <input type="text" style="height:30px;width:70px;" id="num5" onblur="check2()"> <input type="text" style="height:30px;width:70px;" id="num6" onblur="check2()"> <input type="text" style="height:30px;width:70px;" id="num7" onblur="check2()" > <input type="text" style="height:30px;width:70px;" id="num8" onblur="check2()"> <input type="text" style="height:30px;width:70px;" id="num9" onblur="check2()"> <input type="text" style="height:30px;width:70px;" id="num10"onblur="check2()"> <input type="button" value="当たっているかな" onclick="button2()" id="click2"> <p id="kekka3"></p> USER :[<span id="user1ban">&emsp;&emsp;&emsp;</span>] [<span id="user2ban">&emsp;&emsp;&emsp;</span>] [<span id="user3ban">&emsp;&emsp;&emsp;</span>] [<span id="user4ban">&emsp;&emsp;&emsp;</span>] [<span id="user5ban">&emsp;&emsp;&emsp;</span>] [<span id="user6ban">&emsp;&emsp;&emsp;</span>] [<span id="user7ban">&emsp;&emsp;&emsp;</span>] [<span id="user8ban">&emsp;&emsp;&emsp;</span>] [<span id="user9ban">&emsp;&emsp;&emsp;</span>] [<span id="user10ban">&emsp;&emsp;&emsp;</span>] <br> <br> COM : [<span id="com1ban">&emsp;&emsp;&emsp;</span>] [<span id="com2ban">&emsp;&emsp;&emsp;</span>] [<span id="com3ban">&emsp;&emsp;&emsp;</span>] [<span id="com4ban">&emsp;&emsp;&emsp;</span>] [<span id="com5ban">&emsp;&emsp;&emsp;</span>] [<span id="com6ban">&emsp;&emsp;&emsp;</span>] [<span id="com7ban">&emsp;&emsp;&emsp;</span>] [<span id="com8ban">&emsp;&emsp;&emsp;</span>] [<span id="com9ban">&emsp;&emsp;&emsp;</span>] [<span id="com10ban">&emsp;&emsp;&emsp;</span>] <br> <p>当選結果</p><span id="kekka4"></span>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2018/12/02 04:47

質問は編集できます。コード部分を選択し<code>ボタンを押してコードブロックにしてください。
papinianus

2018/12/03 23:55

結局質問は何ですか?既にある回答に照らして長いことが問題だとして長いとなぜだめなのですか?
guest

回答1

0

連番ものを配列にするだけでかなり減らせるはずです。

投稿2018/12/02 04:58

dice142

総合スコア5158

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問