Question

<script language="JavaScript">
<!--
window.addEventListener("DOMContentLoaded", function(){
var a= document.querySelector("input[name='a']");
var b= document.querySelector("input[name='b']");
var c= document.querySelector("input[name='c']");
var x= document.getElementById("x");
var y = document.getElementById("y");
var z = document.getElementById("z");
var btn = document.getElementById("calc");

btn.addEventListener("click", calculate);

function calculate() {


var aVal = a.value.trim();
var bVal = b.value.trim();
var cVal = c.value.trim();

if(aVal > 0 && bVal > 0 && cVal > 0){   

  var ansx = aVal*(1-(cVal/100));
  console.log("Answer = " + ansx);

  ansx = ansx * 100;
  console.log("Answer times 100 = " + ansx);

  ansx = Math.ceil(ansx);
  console.log("Answer times 100, rounded up to nearest whole number = " + ansx);

  ansx = ansx/ 100;
  console.log("Answer divided back by 100 = " + x);

  x.textContent = ansx;

  var ansy = (ansx/2.2)/((((bVal*0.0328)*12)*0.0254)*(((bVal*0.0328)*12)*0.0254))*2.20462
  console.log("Answer = " + ansy);

  ansy = ansy * 100;
  console.log("Answer times 100 = " + ansy);

  ansy = Math.ceil(ansy);
  console.log("Answer times 100, rounded up to nearest whole number = " + ansy);

  ansy = ansy/ 100;
  console.log("Answer divided back by 100 = " + ansy);

  y.textContent = ansy;

  var ansz = ansy+(6.1*(1.8-(((bVal*0.0328)*12)*0.0254)))
  console.log("Answer = " + ansz);

  ansz = ansz * 100;
  console.log("Answer times 100 = " + ansz);

  // Next, round answer up to nearest whole number
  ansz = Math.ceil(ansz);
  console.log("Answer times 100, rounded up to nearest whole number = " + ansz);

  ansz = ansz/ 100;
  console.log("Answer divided back by 100 = " + ansz);

  z.textContent = ansz;

} else{
  alert("Please Fill form in correctly")
  }
  }
  });
</script>



<div class=form2>
 <form name="form">
   <label for="a" class="left">a: </label><input type="text" 
name="a" id="a" size="10"><br>
   <label for="b" class="left">b: </label><input type="text" 
name="b" id="b" size="10"><br>
   <label for="c" class="left">c: </label><input type="text" 
 name="c" id="c" size="10">  
<div><input type="button" value="Calculate" id="calc"></div>
<div class="results">
  <span class="left">x: </span><span id="x"></span><br>
  <span class="left">y: </span><span id="y"></span><br>
  <span class="left">z: </span><span id="z"></span>
</div>
<div class="after">
  <input type="reset" value="Reset">
</div>
</form>
</div>

我使用上面的内容输入3个值a，b，c。这些值应该产生结果-x。然后应该再次使用输入a，b和c来生成y，并使用z再次生成y，如var x，var y和var z所示。

然而，我正在努力获得除NaN之外的任何答案

任何人都可以看到我做错了什么。

我设法让它以与我上一个问题（rounding answers to decimal places）类似的方式编写略有不同的编码，但是我被告知我做错了事。所以我试图以与我所建议的方式类似的方式使用这个计算器

对不起，我已编辑了上述内容......我已更改

var ansx = a*(1-(c/100));

到

var ansx = aVal*(1-(cVal/100));

我仍然没有得到答案： - （

Answer 1

您要将值存储在aVal，bVal和cVal中。但是您尝试在表单输入a，b和c上进行数学运算，这些数字不是数字，因此NaN就是结果。

if (aVal > 0 && bVal > 0 && cVal > 0) {
  var ansx = a * (1 - (c / 100)); // should be aVal * (1 - (cVal / 100))

您可能会考虑养成使用更明确的变量名称的习惯，这有助于防止出现这种错误。或者使用较少的中间变量（例如，如果你刚刚捕获了每个值，而不是在一个变量中捕获表单元素而在另一个变量中捕获值，那么你就不会有额外的变量集来混合向上。）

Answer 2

对不起人，

我已经解决了我自己的问题...输入a和b在同一页面上方的一个函数中使用，这必然导致一些混乱。我已将字母改为c，d和e，现在它可以正常工作

再次抱歉

一个Javascript输入的多个答案

2 个答案: