我正在创建一个HTML网页，其中包含javascript和一个带有提交按钮的小表单，该按钮调用整个javascript代码的功能。
这应该作为BMR +维护卡路里计算器。使用以下公式显示：
男性公制BMR = 66 +（13.7 x体重公斤）+（5 x身高cm） - （6.8 x年龄）
女性公制BMR = 655 +（9.6 x体重公斤）+（1.8 x身高cm） - （4.7 x年龄）
然后发现每日维持卡路里要求（保持相同的体重），根据活动水平有乘数。在创建这些IF语句时，我开始遇到这些问题。
问题：当我点击提交时，没有任何反应。它曾经将用户发送到一个新页面，在那里它显示了document.write文本，但现在它什么也没做。
我认为这是一个相当简单的问题需要解决，但我是javascript的新手，所以任何帮助都会受到赞赏，非常感谢！
<html>
<head>
<title>BMR Calculator</title>
</head>
<body>
<h1> BMR Calculator and Daily Maintenance Calorie Calculator </h1>
<script type="text/javascript" language="javascript">
function Calculate() {
var gender = document.getElementById("gender").value;
var weight = document.getElementById("weight").value;
var height = document.getElementById("height").value;
var age = document.getElementById("age").value;
var result = document.getElementById("result").value;
var MaintenanceCalories = document.getElementById("MaintenanceCalories").value;
var activitylevel = document.getElementById("activitylevel").value;
if(gender=="male")
//English-BMR = 66 + ( 6.23 x weight in pounds ) + ( 12.7 x height in inches ) - ( 6.8 x age in year )
//Metric-BMR = 66 + ( 13.7 x weight in kilos ) + ( 5 x height in cm ) - ( 6.8 x age in years )
{
val1 = 13.7 * weight;
val2 = 5 * height;
val3 = 6.8 * age;
result = 66 + val1 + val2 - val3;
val4 = activitylevel;
}
else if (gender=="female")
//English-Women: BMR = 655 + ( 4.35 x weight in pounds ) + ( 4.7 x height in inches ) - ( 4.7 x age in years)
//Women: BMR = 655 + ( 9.6 x weight in kilos ) + ( 1.8 x height in cm ) - ( 4.7 x age in years )
{
val1 = 9.6 * weight;
val2 = 1.8 * height;
val3 = 4.7 * age;
result = 655 + val1 + val2 - val3;
val4 = activitylevel;
}
if(val4=="l")
{
MaintenanceCalories = result * 1.2;
}
if(val4=="lm")
{
MaintenanceCalories = result * 1.375;
}
if(val4=="m")
{
MaintenanceCalories = result * 1.55;
}
if(val4=="mh")
{
MaintenanceCalories = result * 1.725;
}
else if(val4=="h")
{
MaintenanceCalories = result * 1.9;
}
document.write ('Your BMR is: ' + result.toFixed(2) + '. Your Maintenance Calories are: ' + MaintenanceCalories.toFixed(2));
}
</script>
<form action="#">
Gender : <select id="gender">
<option value="male">Male</option>
<option value="female">Female</option>
</select><br/>
Weight (kg.) : <input type="text" id="weight" /><br />
Height (cm): <input type="text" id="height" /><br />
Age : <input type="text" id="age" /><br />
Current Activity Level: <select id="activitylevel">
<option value="l">Sedentary (Little or No Exercise)</option>
<option value="lm">Lightly Active (Light Exercise/Sports 1-3 Days Per Week)</option>
<option value="m">Moderately Active (Moderate Exercise/Sports 3-5 Days Per Week)</option>
<option value="mh">Very Active (Hard Exercise/Sports 6-7 days Per Week)</option>
<option value="h">Extra Active (Very Intense Exercise/Sports and Physical Job Daily)</option>
</select>
</br>
</br>
</fieldset>
<input type="button" value="Submit" onclick="Calculate()"/>
</form>
答案 0 :(得分：2)
好的，你有这些问题：
这些值应该从文本解析为数字，当val1，val2和val3的计算完成时，我没有检查它们是否被隐式转换。我这样做是因为安全比抱歉更好。
var weight = parseFloat(document.getElementById("weight").value);
var height = parseFloat(document.getElementById("height").value);
var age = parseFloat(document.getElementById("age").value);
有2 var个被分配给不存在的元素的对象。没有id result或MaintenanceCalories的元素。
var result = document.getElementById("result").value;
var MaintenanceCalories = document.getElementById("MaintenanceCalories").value;
MaintenanceCalories现在已初始化为0。
有两组变量没有被正确宣布，他们没有var。如果你这样做，那么它们会自动全局化。虽然在小规模的功能中，它并不重要，但使用var 永远不会伤害。
val1 = 13.7 * weight;
val2 = 5 * height;
val3 = 6.8 * age;
result = 66 + val1 + val2 - val3;
val4 = activity
以下是摘录
<强>段
<!doctype html>
<html>
<head>
<title>BMR Calculator</title>
</head>
<body>
<h1> BMR Calculator and Daily Maintenance Calorie Calculator </h1>
<script>
function Calculate() {
var gender = document.getElementById("gender").value;
var weight = parseFloat(document.getElementById("weight").value);
var height = parseFloat(document.getElementById("height").value);
var age = parseFloat(document.getElementById("age").value);
var activitylevel = document.getElementById("activitylevel").value;
var MaintenanceCalories = 0;
if(gender=="male")
//English-BMR = 66 + ( 6.23 x weight in pounds ) + ( 12.7 x height in inches ) - ( 6.8 x age in year )
//Metric-BMR = 66 + ( 13.7 x weight in kilos ) + ( 5 x height in cm ) - ( 6.8 x age in years )
{
var val1 = 13.7 * weight;
var val2 = 5 * height;
var val3 = 6.8 * age;
var result = 66 + val1 + val2 - val3;
var val4 = activitylevel;
}
else if (gender=="female")
//English-Women: BMR = 655 + ( 4.35 x weight in pounds ) + ( 4.7 x height in inches ) - ( 4.7 x age in years)
//Women: BMR = 655 + ( 9.6 x weight in kilos ) + ( 1.8 x height in cm ) - ( 4.7 x age in years )
{
var val1 = 9.6 * weight;
var val2 = 1.8 * height;
var val3 = 4.7 * age;
var result = 655 + val1 + val2 - val3;
var val4 = activitylevel;
}
switch(val4) {
case "l":
MaintenanceCalories = result * 1.2;
break;
case "lm":
MaintenanceCalories = result * 1.375;
break;
case "m":
MaintenanceCalories = result * 1.55;
break;
case"mh":
MaintenanceCalories = result * 1.725;
break;
case "h":
MaintenanceCalories = result * 1.9;
break;
default: "m";
}
document.write ('Your BMR is: ' + result.toFixed(2) + '. Your Maintenance Calories are: ' + MaintenanceCalories.toFixed(2));
}
</script>
<form action="#">
<fieldset>
Gender : <select id="gender">
<option value="male">Male</option>
<option value="female">Female</option>
</select><br/>
Weight (kg.) : <input type="text" id="weight" /><br />
Height (cm): <input type="text" id="height" /><br />
Age : <input type="text" id="age" /><br />
Current Activity Level: <select id="activitylevel">
<option value="l">Sedentary (Little or No Exercise)</option>
<option value="lm">Lightly Active (Light Exercise/Sports 1-3 Days Per Week)</option>
<option value="m">Moderateley Active (Moderate Exercise/Sports 3-5 Days Per Week)</option>
<option value="mh">Very Active (Hard Exercise/Sports 6-7 days Per Week)</option>
<option value="h">Extra Active (Very Intense Exercise/Sports and Physical Job Daily)</option>
</select>
<br/>
<br/>
</fieldset>
<input type="button" value="Submit" onclick="Calculate()"/>
</form>
答案 1 :(得分：1)
你的问题在线
document.write ('Your BMR is: ' + result.toFixed(2)'. Your Maintenance Calories are: ' + MaintenanceCalories.toFixed(2));
您错过了+：
document.write ('Your BMR is: ' + result.toFixed(2) + '. Your Maintenance Calories are: ' + MaintenanceCalories.toFixed(2));
此外，在您给出的示例中，您缺少一些使脚本工作所需的html元素。 #result和#MaintenanceCalories
我这样添加了它们，它运行得很好：
<div id="result"></div>
<div id="MaintenanceCalories"></div>
另一方面，如果用空字符串初始化这些值（并且不再需要添加html标记），它也没关系：
var result = '';
var MaintenanceCalories = '';
此外，为了将表单保留在页面上，您可以在表单的结束标记之后添加div，其中可以显示结果：
<div id="results"></div>
和JavaScript，在Calculate()函数的末尾：
results.innerHTML ='Your BMR is: ' + result.toFixed(2) + '. Your Maintenance Calories are: ' + MaintenanceCalories.toFixed(2);