尝试修改你的missingleg
函数为此:
function missingleg(a,c) {
if ( isNaN(a) || isNaN(c) ) {
return 0;
}
return Math.sqrt(c*c - a*a);
}
关于风格问题的注释
纯粹出于风格目的,我会尝试在标记中放置尽可能少的代码。将代码保留在标记之外将使以后需要时更容易进行调试。引入一个新功能,updateMissingLeg()
,然后让你的 HTML 像这样调用它:
<input type="text" id="hypo" size="2" onChange="updateMissingLeg()" />
作为奖励,您可以移动您的isNaN()
检查该函数以保持missingleg()
更简单:
function missingleg(a,c){
return Math.sqrt(c*c - a*a);
}
function updateMissingLeg() {
var a = parseInt(document.getElementById('leg').value);
var c = parseInt(document.getElementById('hypo').value);
if ( isNaN(a) || isNaN(c) ) {
document.getElementById('lostleg').value = '';
return;
}
var lostleg = missingleg(a, c);
document.getElementById('lostleg').value = lostleg;
}
作为进一步的好处,您可以调用相同的updateMissingLeg()
两个文本框控件的功能。
UPDATE 2
根据要求,以下是全部内容:
<html>
<head>
<script type="text/javascript">
function missingleg(a,c){
return Math.sqrt(c*c - a*a);
}
function updateMissingLeg() {
var a = parseInt(document.getElementById('leg').value);
var c = parseInt(document.getElementById('hypo').value);
if ( isNaN(a) || isNaN(c) ) {
document.getElementById('lostleg').value = '';
return;
}
var lostleg = missingleg(a, c);
document.getElementById('lostleg').value = lostleg;
}
</script>
</head>
<body>
Leg: <input type="text" id="leg" size="2"
onChange="updateMissingLeg()" />
Hypotenuse: <input type="text" id="hypo" size="2"
onChange="updateMissingLeg()" />
Missing Leg: <input type="text" placeholder="0" id="lostleg" size="2" />
</body>
</html>
可以在这里找到一个可以使用它的jsfiddle。