<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="initial-scale=1.0">
<title>BMIチェック</title>
<style>
table,th,td{
border:1px solid black;
}
table{
border-collapse:collapse;
}
</style>
<script>
//入力チェック（今回は無視）
function bmi_check(){
var height = parseFloat(document.getElementById('height').value);
var weight = parseFloat(document.getElementById('weight').value);
var age = parseFloat(document.getElementById('age').value);
if( isNaN(height) || isNaN(weight) || isNaN(age) ){
document.getElementById('alert').innerHTML = "間違った値が入力されているか、空欄があります";
}
else if( height < 0 || weight < 0 || age < 0){
document.getElementById('alert').innerHTML = "正の値を入力してください";
}
else{
bmi_calc(height, weight, age);
document.getElementById('alert').innerHTML = "";
document.getElementById('result').style.display ='';
}
}
//画面初期化（今回は無視）
function init(){
document.getElementById('alert').innerHTML = "";
document.getElementById("bmi").innerHTML = "";
document.getElementById("standard_weight").innerHTML = "";
document.getElementById("rate").innerHTML = "";
document.getElementById("judgement").innerHTML = "";
document.getElementById('result').style.display ='none';
}
//bmiを計算して画面出力☆
function bmi_calc(height,weight,age){
var bmi = Math.floor( weight /( ( height / 100.0) * (height / 100.0 ))*10)/10;
var is_male = document.getElementById('male').checked;
var lower,upper,judgement;
/************BMI条件分岐始まり***********/
if(is_male){
lower = 20;
upper = 25;
}else if(age < 40){
lower = 18;
upper = 23;
}else{
lower = 19;
upper = 24;
}
if(bmi < bmi){
judgement = "痩せている";
} if(bmi < bmi){
judgement = "標準";
}else{
judgement = "肥満";
}
/************BMI条件分岐終わり***********/
var stdbmi = (upper + lower)/2;
var standard_weight = Math.floor(((height / 100)*(height / 100) * stdbmi)*10)/10;
var subtraction = weight - standard_weight;
var rate = Math.floor((subtraction / standard_weight) * 1000) / 10;
document.getElementById("bmi").innerHTML = bmi;
document.getElementById("standard_weight").innerHTML = standard_weight + 'kg';
document.getElementById("rate").innerHTML = rate + '%';
document.getElementById("judgement").innerHTML = judgement;
}
</script>
</head>
<body onLoad="init();">
<h1>BMIチェック</h1>
<form name="bmicheck">
<p id="alert"></p>
<table>
<tbody>
<tr>
<th>性別</th><td><input type="radio" name="sex" id="male" value="male">男
<input type="radio" name="sex" id="female" value="female">女</td>
</tr>
<tr>
<th>年齢</th><td><input type="text" size="5" name="age" id="age" value="">歳</td>
</tr>
<tr>
<th>身長</th><td><input type="text" name="height" id="height" size="5" value="">cm</td>
</tr>
<tr>
<th>体重</th><td><input type="text" name="weight" id="weight" size="5" value="">kg</td>
</tr>
</tbody>
<tfoot id="result">
<tr>
<th>BMI</th><td id="bmi"></td>
</tr>
<tr>
<th>標準体重</th><td id="standard_weight"></td>
</tr>
<tr>
<th>標準体重比</th><td id="rate"></td>
</tr>
<tr>
<th>判定</th><td id="judgement"></td>
</tr>
</tfoot>
</table>
<button type="button" onClick="bmi_check()">結果を見る</button><button type="reset" onClick="init()">リセット</button>
</form>
</body>
</html>