在计算器中将字符串转换为数字
Convert string to number in calculator
我不是专业的程序员,所以请不要因为我的简单问题而反对我。我相信答案很简单,但我想不通。
我正在尝试设计一个覆盖计算器以放在我公司的网站上。我的代码似乎接受了输入,但返回的是 NaN 值。正如我所料,它显然正在将信息转换为字符串。我尝试通过从最后一个变量中减去 0 并使用 parseInt 将其转换回数字。似乎都不起作用。有人愿意解释如何解决这个问题,以及为什么你的解决方案有效。我正在努力了解我做错了什么。
查看下面的代码。
谢谢。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Mulch Calculator</h1>
<form name="calcInput" id="calcInfoInput">
The length of the area you need to cover (in feet). <input type="text" name="length"
<br></br>
<br></br>
The width of the area you need to cover (in feet). <input type="text" `enter code here`name="width"
<br></br>
<br></br>
The depth of coverage you need (in inches). <input type="text" name="depth"
<br></br>
<br></br>
</form>
<input type="submit" value="Calculate Your Mulch Needs." onclick="processForm()" name="submit">
<input type="reset" value="Clear This Form.">
</form>
<script type ="text/javascript">
function processForm()
{
var allInfo = document.getElementById ("calcInfoInput");
var bedLength = allInfo.elements["length"].value;
var bedWidth = allInfo.elements["width"].value;
var bedDepthInches = allInfo.elements["depth"].value;
var squareFeet = bedLength * bedWidth;
var bedDepth = bedDepthInches / 12;
var cubicFeet = squareFeet * bedDepth;
var cubicYards = cubicFeet / 27;
//cubicYards = cubicYards-0;
//cubicYards = parseInt( cubicYards, 10 );
document.write('You will need at least '+ cubicYards +' cubic yards for your project.');
}
</script>
</body>
您的输入值应该以 10 作为基数通过 parseInt() 函数,并且您应该检查您没有使用 isNaN(num) 得到 NaN。 Javascript 是松散类型的,但这并不一定意味着您可以在不检查变量的情况下通过类型抛出变量。
所以我已经修好了!
你的问题原来是你如何从输入中获取数据。
你用过这个:
var bedLength = allInfo.elements["length"].value;
我用过这个:
var bedLength = +allInfo["length"].value;
所以基本上我删除了每个使用输入值的地方的 .elements
。
我还补充了:
calcscale = (calcscale).toFixed(3);
这会将小数点后一位缩减为 3(这样您就不会得到像 3.111111111111111117 或类似的答案)!
function calculate() {
var allInfo = document.getElementById("calcInfoInput");
var bedLength = +allInfo["length"].value;
var bedWidth = +allInfo["width"].value;
var bedDepthInches = +allInfo["depth"].value;
var squareFeet = bedLength * bedWidth;
var bedDepth = bedDepthInches / 12;
var cubicFeet = squareFeet * bedDepth;
var cubicYards = cubicFeet / 27;
//cubicYards = cubicYards-0;
//cubicYards = parseInt( cubicYards, 10 );
output = (cubicYards).toFixed(3);
document.getElementById("result").innerHTML = 'You will need at least ' + output + ' cubic yards for your project.';
}
<body>
<h1>Mulch Calculator</h1>
<form name="calcInput" id="calcInfoInput">
The length of the area you need to cover (in feet).
<input type="text" name="length" />
<br>
<br>The width of the area you need to cover (in feet).
<input type="text" name="width" />
<br>
<br>The depth of coverage you need (in inches).
<input type="text" name="depth" />
<br>
<br>
</form>
<input type="submit" id="byBtn" value="Calculate You're Mulch Needs." onclick="calculate()" />
<input type="reset" value="Clear This Form.">
<br>
<br>
<div id="result"></div>
</form>
</body>
我不是专业的程序员,所以请不要因为我的简单问题而反对我。我相信答案很简单,但我想不通。
我正在尝试设计一个覆盖计算器以放在我公司的网站上。我的代码似乎接受了输入,但返回的是 NaN 值。正如我所料,它显然正在将信息转换为字符串。我尝试通过从最后一个变量中减去 0 并使用 parseInt 将其转换回数字。似乎都不起作用。有人愿意解释如何解决这个问题,以及为什么你的解决方案有效。我正在努力了解我做错了什么。
查看下面的代码。
谢谢。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Mulch Calculator</h1>
<form name="calcInput" id="calcInfoInput">
The length of the area you need to cover (in feet). <input type="text" name="length"
<br></br>
<br></br>
The width of the area you need to cover (in feet). <input type="text" `enter code here`name="width"
<br></br>
<br></br>
The depth of coverage you need (in inches). <input type="text" name="depth"
<br></br>
<br></br>
</form>
<input type="submit" value="Calculate Your Mulch Needs." onclick="processForm()" name="submit">
<input type="reset" value="Clear This Form.">
</form>
<script type ="text/javascript">
function processForm()
{
var allInfo = document.getElementById ("calcInfoInput");
var bedLength = allInfo.elements["length"].value;
var bedWidth = allInfo.elements["width"].value;
var bedDepthInches = allInfo.elements["depth"].value;
var squareFeet = bedLength * bedWidth;
var bedDepth = bedDepthInches / 12;
var cubicFeet = squareFeet * bedDepth;
var cubicYards = cubicFeet / 27;
//cubicYards = cubicYards-0;
//cubicYards = parseInt( cubicYards, 10 );
document.write('You will need at least '+ cubicYards +' cubic yards for your project.');
}
</script>
</body>
您的输入值应该以 10 作为基数通过 parseInt() 函数,并且您应该检查您没有使用 isNaN(num) 得到 NaN。 Javascript 是松散类型的,但这并不一定意味着您可以在不检查变量的情况下通过类型抛出变量。
所以我已经修好了!
你的问题原来是你如何从输入中获取数据。
你用过这个:
var bedLength = allInfo.elements["length"].value;
我用过这个:
var bedLength = +allInfo["length"].value;
所以基本上我删除了每个使用输入值的地方的 .elements
。
我还补充了:
calcscale = (calcscale).toFixed(3);
这会将小数点后一位缩减为 3(这样您就不会得到像 3.111111111111111117 或类似的答案)!
function calculate() {
var allInfo = document.getElementById("calcInfoInput");
var bedLength = +allInfo["length"].value;
var bedWidth = +allInfo["width"].value;
var bedDepthInches = +allInfo["depth"].value;
var squareFeet = bedLength * bedWidth;
var bedDepth = bedDepthInches / 12;
var cubicFeet = squareFeet * bedDepth;
var cubicYards = cubicFeet / 27;
//cubicYards = cubicYards-0;
//cubicYards = parseInt( cubicYards, 10 );
output = (cubicYards).toFixed(3);
document.getElementById("result").innerHTML = 'You will need at least ' + output + ' cubic yards for your project.';
}
<body>
<h1>Mulch Calculator</h1>
<form name="calcInput" id="calcInfoInput">
The length of the area you need to cover (in feet).
<input type="text" name="length" />
<br>
<br>The width of the area you need to cover (in feet).
<input type="text" name="width" />
<br>
<br>The depth of coverage you need (in inches).
<input type="text" name="depth" />
<br>
<br>
</form>
<input type="submit" id="byBtn" value="Calculate You're Mulch Needs." onclick="calculate()" />
<input type="reset" value="Clear This Form.">
<br>
<br>
<div id="result"></div>
</form>
</body>