计算帮助需要与javascript目标心率计算器
calculation help needed with javascript target heart rate calculator
所以我有点新的javascript和我有一个问题与目标心率计算器我试图创建。当我点击计算按钮时，什么也没有发生。谁能告诉我我哪里做错了?
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"lang="en">
<head>
<link href='http://fonts.googleapis.com/css?family=Nixie+One' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/workitt.css">
<script>
function initTH(){
document.getElementById("calcButton").onclick = thr;
}
function thr(){
var age = document.getElementById("age").value;
if(age = ""){
document.getElementById("error").innerHTML = "This field is required.";
}
else{
var THRmax = (220-age)*.85;
var THRmin = (220-age)*.7;
document.getElementById("THRzone").innerHTML = THRmin + "-" + THRmax;
}
}
</script>
<title>Workitt</title>
</head>
<body>
<CENTER><div class="header">
<h1><img src="images/workitt-header.jpg" alt=header ></h1>
<div class="navbar">
<a href="workitt.html">Home</a> |
<a href="profile.html">Profile</a> |
<a href="createworkout.html">Create A Workout</a> |
<a href="accessories.html">Fitness Accessories</a>
</div>
<p> </p>
</div></CENTER>
<CENTER><div class="body">
<form>
<table class="table1" border="7" bordercolor=WHITE width="250" align="center" bgcolor="#ffffff">
<thead>
<tr>
<th colspan="2"><font size=5>
Target Heart Rate</font>
</th>
</tr>
<tr> </tr>
<tr> </tr>
</thead>
<tbody>
<tr>
<td align="center">
<label for="age">Age:</label>
</td>
<td align="center">
<input type="text" id="age" name="age" size="6"> years
</td>
</tr>
</tbody>
<thead>
<tr>
<th colspan="2" align="center">
<input id="calcButton" type="button" value="calculate" />
<span id="error"></span>
</th>
</tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr>
<th colspan="2">
Your Target Heart Rate Zone is: <span id="THRzone"></span>
</th>
</tr>
</thead>
</table>
</form>
<p>*Your target heart rate zone is the zone in which your heart rate should be in when exercising to have the most effective workout for improving your fitness and burning calories.</p>
</div></CENTER>
</body>
</html>
您的脚本的问题，正如在评论中指出的那样，是您从未调用initTH()，因此按钮单击处理程序从未附加到按钮。
注释没有注意到的是，您的脚本将放在HTML的之前。特别是，它出现在<input id="calcButton" type="button" value="calculate" />之前，这意味着如果您在调用document.getElementById("calcButton")时不小心，它将返回null。
听起来你想做的是在body的end添加一个额外的<script>元素(就在close </body>标记之前)并调用initTH():
....
<script>
initTH();
</script>
</body>
正如其他人所提到的，initTH()函数永远不会被调用。
我在这里做了一些改变:http://jsfiddle.net/GaryHarrower/j4v7M/
我删除了这个功能，所以只要按下按钮，它就会运行。
脚本中还有age = ""，这应该是带有2 =符号的age == ""
让我知道你进展如何!
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"lang="en">
<head>
<link href='http://fonts.googleapis.com/css?family=Nixie+One' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/workitt.css">
<title>Workitt</title>
</head>
<body>
<CENTER>
<div class="header">
<h1><img src="images/workitt-header.jpg" alt=header ></h1>
<div class="navbar">
<a href="workitt.html">Home</a> |
<a href="profile.html">Profile</a> |
<a href="createworkout.html">Create A Workout</a> |
<a href="accessories.html">Fitness Accessories</a>
</div>
<p> </p>
</div>
</CENTER>
<CENTER>
<div class="body">
<form>
<table class="table1" border="7" bordercolor=WHITE width="250" align="center" bgcolor="#ffffff">
<thead>
<tr>
<th colspan="2"><font size=5>
Target Heart Rate</font>
</th>
</tr>
<tr> </tr>
<tr> </tr>
</thead>
<tbody>
<tr>
<td align="center">
<label for="age">Age:</label>
</td>
<td align="center">
<input type="text" id="age" name="age" size="6"> years
</td>
</tr>
</tbody>
<thead>
<tr>
<th colspan="2" align="center">
<input id="calcButton" type="button" value="calculate" />
<span id="error"></span>
</th>
</tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr> </tr>
<tr>
<th colspan="2">
Your Target Heart Rate Zone is: <span id="THRzone"></span>
</th>
</tr>
</thead>
</table>
</form>
<p>*Your target heart rate zone is the zone in which your heart rate should be in when exercising to have the most effective workout for improving your fitness and burning calories.</p>
</div></CENTER>
<script>
document.getElementById("calcButton").onclick = thr;
function thr(){
var age = document.getElementById("age").value;
if(age == ""){
document.getElementById("error").innerHTML = "This field is required.";
}
else
{
var THRmax = (220-age)*.85;
var THRmin = (220-age)*.7;
document.getElementById("THRzone").innerHTML = THRmin + "-" + THRmax;
}
}
</script>
</body>
</html>
相关文章：
- YUI3 IO实用程序是否可以根据给定的内容类型标头值自动序列化数据
- 为什么HTML5拖放的目标是孩子?(可排序列表）
- 如何编写一个具有公共标头的批处理
- 如何告诉MathJax对下标使用替代语法
- 正在传递JSONP标头's数据参数到另一个文件中的AJAX请求
- 如何覆盖锚点元素's href目标，并在我点击转到目标javascript时删除其他错误
- 对一个对象使用reduce可以返回一个没有't在数组中包含目标字母
- Href:当前DIV中的目标ID
- 否'访问控制允许来源'标头存在于IISNOde中请求的资源(AngularJS+NodeJs）上
- 如何使用自定义标头跨域执行AJAX POST
- 由于响应中不存在“Access Control Allow Origin”标头，跨域请求停止工作
- 当使用extern和目标JavaScript时，我如何强制Haxe编译器使用require语句
- IIS动态HTTP响应标头
- 将接受标头参数传递给jQueryAJAX
- 以ECMAScript 5及更高版本为目标时，八进制文字不可用
- 如何使用ember.js在操作中传递当前上下文中目标旁边的信息
- NodeJS错误-Can't在发送标头后设置标头
- JavaScript过期标头可以't设置为12个月
- 无法在基于Cordova的应用程序中读取Set Cookie标头
- 计算帮助需要与javascript目标心率计算器
