htmlをソース短縮についてです。
できれば2次元のHashMapを使っていただけるとありがたいです。
栄養素の合計値を食べたものから算出するツールで、
野菜1は kcal 100 na 10 mg 20
野菜2は kcal 20 na 20 mg 10
野菜3は kcal 30 na 15 mg 40
の栄養素を基本的に摂取でき、食べた時の吸収能力によって補正を与えて複数の合計値を求めたいです。
ひとまず動くものはできたのですが、入力欄ごとにifを使わなければならないことと、その後数値化して最大値と最小値を指定するだけで非常に長くなってしまいました。
食べ物の種類を数百まで増やさなければならないので入力欄を増やすとソースが膨大になってしまいます。
そのため全ての入力欄の食べ物の栄養素をまとめて指定する方法(HashMapというのが便利みたいですが使い方が分かりませんでした)、また単純に省略できる部分について教えていただきたいです
人数: <input type="text" value="1" id="a1" class="example"><br /><br /> 日数: <input type="text" value="1" id="b1" class="example"><br /><br /> <select style="width: 222.297px;" id="ve1"> <option value="a">野菜1</option> <option value="b">野菜2</option> <option value="c">野菜3</option> </select> <select id="abs1"> <option value="x">吸収力弱</option> <option value="y">吸収力中</option> <option value="z">吸収力強</option> </select><br /><br /> <select style="width: 222.297px;" id="ve2" > <option value="a">野菜1</option> <option value="b">野菜2</option> <option value="c">野菜3</option> </select> <select id="abs2"> <option value="x">吸収力弱</option> <option value="y">吸収力中</option> <option value="z">吸収力強</option> </select><br /><br /> <select id="ve3" style="width: 222.297px;"> <option value="a">野菜1</option> <option value="b">野菜2</option> <option value="c">野菜3</option> </select> <select id="abs3"> <option value="x">吸収力弱</option> <option value="y">吸収力中</option> <option value="z">吸収力強</option> </select><br /><br /> <input onclick="practice_sum()" id="sum" value="計算!" type="button"> <br /> 計算結果(一人当たり)<br /> <label>カロリー<output id="aresulta">未入力計算</output></label><br /> <label>ナトリウム<output id="aresultb">未入力計算</output></label><br /> <label>マグネシウム<output id="aresultc">未入力計算</output></label><br /> 計算結果(全員)<br /> <label>カロリー<output id="resulta">未入力計算</output></label><br /> <label>ナトリウム<output id="resultb">未入力計算</output></label><br /> <label>マグネシウム<output id="resultc">未入力計算</output></label> 計算結果(日数分)<br /> <label>カロリー<output id="sresulta">未入力計算</output></label><br /> <label>ナトリウム<output id="sresultb">未入力計算</output></label><br /> <label>マグネシウム<output id="sresultc">未入力計算</output></label> <script> function practice_sum() { ve2 = document.getElementById("ve2").value; ve3 = document.getElementById("ve3").value; ve1 = document.getElementById("ve1").value; abs2 = document.getElementById("abs2").value; abs3 = document.getElementById("abs3").value; abs1 = document.getElementById("abs1").value; if (ve1 == "a") { kcal1 = 100; na1 = 10; mg1 = 20; } if (ve1 == "b") { kcal1 = 20; na1 = 20; mg1 = 10; } if (ve1 == "c") { kcal1 = 30; na1 = 15; mg1 = 40; } if (ve2 == "a") { kcal2 = 100; na2 = 10; mg2 = 20; } if (ve2 == "b") { kcal2 = 20; na2 = 20; mg2 = 10; } if (ve2 == "c") { kcal2 = 30; na2 = 15; mg2 = 40; } if (ve3 == "a") { kcal3 = 100; na3 = 10; mg3 = 20; } if (ve3 == "b") { kcal3 = 20; na3 = 20; mg3 = 10; } if (ve3 == "c") { kcal3 = 30; na3 = 15; mg3 = 40; } if (abs1 == "x") { kcal1a = 1; na1a = 1; mg1a = 0.8; } if (abs1 == "y") { kcal1a = 1.2; na1a = 1.1; mg1a = 1.1; } if (abs1 == "z") { kcal1a = 1.3; na1a = 1.2; mg1a = 1.7; } if (abs2 == "x") { kcal2a = 1; na2a = 1; mg2a = 0.8; } if (abs2 == "y") { kcal2a = 1.20; na2a = 1.1; mg2a = 1.1; } if (abs2 == "z") { kcal2a = 1.30; na2a = 1.2; mg2a = 1.7; } if (abs3 == "x") { kcal3a = 1; na3a = 1; mg3a = 0.8; } if (abs3 == "y") { kcal3a = 1.2; na3a = 1.1; mg3a = 1.1; } if (abs3 == "z") { kcal3a = 1.3; na3a = 1.2; mg3a = 1.7; } keisan(kcal1, na1, mg1,kcal2, na2, mg2,kcal3, na3, mg3, kcal1a, na1a, mg1a, kcal2a, na2a, mg2a,kcal3a, na3a, mg3a) } function keisan(kcal1, na1, mg1,kcal2, na2, mg2,kcal3, na3, mg3, kcal1a, na1a, mg1a, kcal2a, na2a, mg2a,kcal3a, na3a, mg3a) { var kcal1l = parseFloat(kcal1); var na1l = parseFloat( na1); var mg1l = parseFloat( mg1); var kcal2l = parseFloat(kcal2); var na2l = parseFloat( na2); var mg2l = parseFloat( mg2); var kcal3l = parseFloat(kcal3); var na3l = parseFloat( na3); var mg3l = parseFloat( mg3); var kcal1al = parseFloat(kcal1a); var na1al = parseFloat( na1a); var mg1al = parseFloat( mg1a); var kcal2al = parseFloat(kcal2a); var na2al = parseFloat( na2a); var mg2al = parseFloat( mg2a); var kcal3al = parseFloat(kcal3a); var na3al = parseFloat( na3a); var mg3al = parseFloat( mg3a); var a1l = parseFloat(document.getElementById("a1").value); var b1l = parseFloat(document.getElementById("b1").value); aresulta = (kcal1l*kcal1al+kcal2l*kcal2al+kcal3l*kcal3al); if(aresulta > 99999999){ document.getElementById("aresulta").value = 99999999; }else if (aresulta < 0){document.getElementById("aresulta").value = 0; }else{ document.getElementById("aresulta").value = Math.floor(aresulta); } aresultb = (na1l*na1al+na2l*na2al+na3l*na3al) ; if(aresultb > 99999999){ document.getElementById("aresultb").value = 99999999; }else if (aresultb < 0){document.getElementById("aresultb").value = 0; }else{ document.getElementById("aresultb").value = Math.floor(aresultb); } aresultc = (mg1l*mg1al+mg2l*mg2al+mg3l*mg3al); if(aresultc > 99999999){ document.getElementById("aresultc").value = 99999999; }else if (aresultc < 0){document.getElementById("aresultc").value = 0; }else{ document.getElementById("aresultc").value = Math.floor(aresultc); } resulta = (kcal1l*kcal1al+kcal2l*kcal2al+kcal3l*kcal3al)*a1l ; if(resulta > 99999999){ document.getElementById("resulta").value = 99999999; }else if (resulta < 0){document.getElementById("resulta").value = 0; }else{ document.getElementById("resulta").value = Math.floor(resulta); } resultb = (na1l*na1al+na2l*na2al+na3l*na3al)*a1l ; if(resultb > 99999999){ document.getElementById("resultb").value = 99999999; }else if (resultb < 0){document.getElementById("resultb").value = 0; }else{ document.getElementById("resultb").value = Math.floor(resultb); } resultc = (mg1l*mg1al+mg2l*mg2al+mg3l*mg3al)*a1l ; if(resultc > 99999999){ document.getElementById("resultc").value = 99999999; }else if (resultc < 0){document.getElementById("resultc").value = 0; }else{ document.getElementById("resultc").value = Math.floor(resultc); } sresulta = (kcal1l*kcal1al+kcal2l*kcal2al+kcal3l*kcal3al); if(sresulta > 99999999){ document.getElementById("sresulta").value = 99999999; }else if (sresulta < 0){document.getElementById("sresulta").value = 0; }else{ document.getElementById("sresulta").value = Math.floor(sresulta); } sresultb = (na1l*na1al+na2l*na2al+na3l*na3al) ; if(sresultb > 99999999){ document.getElementById("sresultb").value = 99999999; }else if (sresultb < 0){document.getElementById("sresultb").value = 0; }else{ document.getElementById("sresultb").value = Math.floor(sresultb); } sresultc = (mg1l*mg1al+mg2l*mg2al+mg3l*mg3al); if(sresultc > 99999999){ document.getElementById("sresultc").value = 99999999; }else if (sresultc < 0){document.getElementById("sresultc").value = 0; }else{ document.getElementById("sresultc").value = Math.floor(sresultc); } } </script></div></div></span>
回答2件
あなたの回答
tips
プレビュー