１つのalert画面にbmiと評価を表示させたい

javascript
1<!DOCTYPE html>
2<html>
3<head>
4<meta charset="utf-8">
5<title>BMI</title>
6</head>
7<body>
8
9 <p>身長(cm): <input type="number" id="height"></p>
10 <p>体重(kg): <input type="number" id="weight"></p>
11 <p><input type="button" value="BMIを計算" onclick="calc();"></p>
12
13<script>
14function calc(){
15  let h = Number(document.getElementById("height").value);
16  let w = Number(document.getElementById("weight").value);
17  alert( Math.floor(w / ( (h / 100) * (h / 100) )) );
18
19   let bmi = w / ( h / 100) * (h / 100);
20
21     if (bmi < 18.5){
22         alert('瘦せ型です');
23     }
24         else if(bmi >=18.5 && bmi < 25){
25             alert('標準体型です');
26         }
27             else{
28                 alert('肥満です');
29             }
30
31  }
32
33</script>
34</body>
35</html>
36

この記述は以前に質問して解答をいただいたものです。
この記述ではalertが２つ表示されます。
bmiの値と評価を１つのalert画面に表示させられないでしょうか？
考えたのですが、全くその方法が浮かびません。
お分かりになる方がおいででしたらよろしくお願いします。

行動規範の内容に同意します

回答2件

文字列は連結して1つの文字列にすることができるので、２つのalertの文字列を連結してやればよいです。

投稿2020/03/22 07:49

javahack

総合スコア1088

beginner001

2020/03/24 03:05

申し訳ありませんが、その連結が全く分かりません。

行動規範の内容に同意します

ベストアンサー

alert() の引数に渡す文字列に改行（\n）を含めて複数行にしてはどうでしょう。

javascript
1let bmi; // BMIの計算結果
2let msg; // 結果を受けてのメッセージ
3
4/* if 文でメッセージ決定 */
5
6alert(`${bmi}\n${msg}`);
7// alert("aaa\nbbb");
8

コメントを受けて

javascript
1function calc(){
2  let h = Number(document.getElementById("height").value);
3  let w = Number(document.getElementById("weight").value);
4
5  //alert( Math.floor(w / ( (h / 100) * (h / 100) )) );
6  // 計算式が合っていたので、変数 bmi に記憶
7  //let bmi = w / ( h / 100) * (h / 100);
8  let bmi = w / (( h / 100) * (h / 100));
9
10  // bmi によって 変数 msg を書き換えてゆく
11  let msg = ""; // 空文字で初期化
12  if (bmi < 18.5){
13    msg = '瘦せ型です';
14  }
15  else if(bmi >=18.5 && bmi < 25){
16    msg = '標準体型です';
17  }
18  else{
19    msg = '肥満です';
20  }
21  
22  // alert 用　文字列の連結（数値変数は文字列になる）
23  // 古典） alert( bmi + "\n" + msg );
24  alert( `${bmi}\n${msg}` );
25}

「変数の扱い」や「if 文による条件ごとの切り分け」を使っています。

初学のうちは、MDN JavaScript の第一歩を読み進めると、段階的に理解を深めることができます。

投稿2020/03/22 06:18

編集2020/03/26 02:02

AkitoshiManabe

総合スコア5432

beginner001

2020/03/24 03:10

下記のように考えてみましたが、全くわかりません。 <script> function calc(){ let h = Number(document.getElementById("height").value); let w = Number(document.getElementById("weight").value); let bmi = w / ( h / 100) * (h / 100); let msg = alert( Math.floor(w / ( (h / 100) * (h / 100) )) ); if (bmi < 18.5){ alert('瘦せ型です'); } else if(bmi >=18.5 && bmi < 25){ alert('標準体型です'); } else{ alert('肥満です'); } } </script> let bmi = w / ( h / 100) * (h / 100); if (bmi < 18.5){ alert('瘦せ型です'); } else if(bmi >=18.5 && bmi < 25){ alert('標準体型です'); } else{ alert('肥満です'); } } </script>

beginner001

2020/03/25 23:01

細かいところまで説明して頂いてありがとうございました。実行してみますと、どんな数字を入れても入力した体重と「肥満です」のメッセージが出てしまいます。よろしくお願いします。