詳しい人求む！

JavaScriptで計算問題のページを作成したい

解決済

質問者：LBJ236
質問日時：2021/09/18 18:44
回答数：1件

LBJ236と申します。
現在、計算問題のページを作成しているのですが、form内に入力した解答とランダムな6つの数値の合計との比較（合っているのか）が出来なく、手詰まりになってしまっています。
私なりにソースコードを書いたので見て頂けると幸いです。
<body>

<p class = "main_p1">
<span id="t1">0</span>+<span id="t2">0</span>+
<span id="t3">0</span>+<span id="t4">0</span>+
<span id="t5">0</span>+<span id="t6">0</span>=
</p>

<p class = "main_p2"><input id="b1" type="button" value="start" onclick="cb1()">

<input id="input">
<span id="message">
<script>
input.addEventListener('keydown', (e) => {
if(e.key === 'Enter') {
document.getElementById("t1").textContent=(Random(1, 9));
document.getElementById("t2").textContent=(Random(1, 9));
document.getElementById("t3").textContent=(Random(1, 9));
document.getElementById("t4").textContent=(Random(1, 9));
document.getElementById("t5").textContent=(Random(1, 9));
document.getElementById("t6").textContent=(Random(1, 9));
//var input = document.getElementById("input").value;
//var a = parseInt(input, 10);
//var result = document.getElementById("result");
//result.value = a;
input.value = "";
}
})
</script>

</body>

よろしければ上記の内容で製作する方法を教えていただけませんでしょうか？
よろしくお願いします。

エンターを押すことで60回ほどランダムの数字を表示し、一問目同様に正解か不正解を表示するというものです。

補足日時：2021/09/19 14:28
通報する

通報する

この質問は特に20代・男性の方に
リクエストされています！
(回答を制限するものではありません。)

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： sukitaro
回答日時：2021/09/18 20:12

ユーザーの動きがよく分からなかったのですが、

1.「start」ボタンを押す
2.ランダムな6個の数字（1以上9以下）が決まる
3.入力欄に、6個の和を入力する
4.Enterキーを押すか、「比較」ボタンを押す
5.比較結果のメッセージが表示される

というものと仮定して、作ってみました。
間違っていたらすみません。

<body>

<p class="main_p1">
<span id="t1">0</span>+<span id="t2">0</span>+
<span id="t3">0</span>+<span id="t4">0</span>+
<span id="t5">0</span>+<span id="t6">0</span>=
</p>

<p class="main_p2">
<input id="b1" type="button" value="start" onclick="cb1()">
</p>

<p class="main_p2">
<input id="input" type="text" />
<input id="b2" type="button" value="比較" onclick="compare()">
</p>
<p id="message"></p>
<script>
let n1,n2,n3,n4,n5,n6;
let result = 0;
let message = document.getElementById('message');
let input = document.getElementById('input');
input.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {compare();}
});

function cb1() {
n1 = Math.floor(Math.random() * 9) + 1;
n2 = Math.floor(Math.random() * 9) + 1;
n3 = Math.floor(Math.random() * 9) + 1;
n4 = Math.floor(Math.random() * 9) + 1;
n5 = Math.floor(Math.random() * 9) + 1;
n6 = Math.floor(Math.random() * 9) + 1;
result = n1 + n2 + n3 + n4 + n5 + n6;

document.getElementById("t1").textContent = n1;
document.getElementById("t2").textContent = n2;
document.getElementById("t3").textContent = n3;
document.getElementById("t4").textContent = n4;
document.getElementById("t5").textContent = n5;
document.getElementById("t6").textContent = n6;
}

function compare(){
if (result === parseInt(input.value)) {
message.textContent = '合っています！';
} else if (result < parseInt(input.value)) {
message.textContent = 'もっと小さいです！';
} else if (result > parseInt(input.value)) {
message.textContent = 'もっと大きいです！';
}else{
message.textContent = '比較できません！';
}
}

</script>
</body>