JEGAN

2022/1/26 4:27

11回答

JavaScriptの問題で、 ３つの科目の点数を入力し、「合計」、「平均」の値を結果に表示する 【プラス】平均点を小数点ありで表示させる

JavaScriptの問題で、 ３つの科目の点数を入力し、「合計」、「平均」の値を結果に表示する 【プラス】平均点を小数点ありで表示させる とあるのですがやり方がよくわかりません。わかる方お願いします。 ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ .HTML <div id="ques4"> <h3>問題４</h3> <p> ３つの科目の点数を入力し、「合計」、「平均」の値を結果に表示する <br>【プラス】平均点を小数点ありで表示させる </p> <p> JS：<input type="text" id="js" name="operator" value="" > </p> <p> PH：<input type="text" id="ph" name="operator" value=""> </p> <p> DB：<input type="text" id="db" name="operator" value=""> </p> <p> <button id="btn" type="submit" name="operator" value="total" >合計</button> <button id="btn" type="submit" name="operator" value="average" >平均</button> </p> <p id="answer">結果</p> </div>

JavaScript | プログラミング・58閲覧・xmlns="http://www.w3.org/2000/svg">25

ベストアンサー

0
ybb********

カテゴリマスター

2022/1/26 9:26

JEGANさん >････「合計」、「平均」の値を結果に表示････････ ご参考に↓ <!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <div id="ques4"> <h3>問題４</h3> <p> ３つの科目の点数を入力し、「合計」、「平均」の値を結果に表示する <br>【プラス】平均点を小数点ありで表示させる </p> <p> JS：<input type="text" id="js" name="operator" value="" > </p> <p> PH：<input type="text" id="ph" name="operator" value=""> </p> <p> DB：<input type="text" id="db" name="operator" value=""> </p> <p> <button id="btn1" type="submit" name="operator" value="total" >合計</button> <button id="btn2" type="submit" name="operator" value="average" >平均</button> </p> <p id="answer">結果</p> </div> <script> const button1 = document.getElementById('btn1'); const button2 = document.getElementById('btn2'); button1.addEventListener('click', function (event) { calc(); }); button2.addEventListener('click', function (event) { calc(); }); function calc(){ let js = Number( document.getElementById('js').value ); let ph = Number( document.getElementById('ph').value ); let db = Number( document.getElementById('db').value ); let kei = js + ph + db; let av = (kei / 3).toFixed(1); document.getElementById('answer').innerHTML = '合計は、' + kei + '点です<br>平均は、' + av+ '点です<br>'; } </script> </body> </html>