Question

我不确定如何获取2个输入并返回另一个值。还有什么方法让我能够分辨出我的代码出错了吗？我仍然试图理解HTML和Javascript如何协同工作的所有细微差别。我目前正在通过Eloquent javascript阅读，但我一直在寻找建议的资源。

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Wilks</title>
        <script type="text/javascript" src="wilks.js"></script>
    </head>
    <body>
        <p>
            <label for="bodyWeight">Weight:</label> 
            <input id="bodyWeight" type="number" placeholder="Pounds">
            <label for="Big 3 Total">Big 3 Total:</label>
            <input id="liftTotal" type="number" placeholder="800" >
            <button onclick="wilksCalculator(bodyWeight, liftTotal)">Analyze</button>
        </p>
        <p>Wilks Coefficient: <span id="outputWilks"></span></p>
    </body>
</html>

// wilks.js

var a =-216.0475144;
var b =16.2606339;
var c =-0.002388645;
var d =-0.00113732;
var e =7.01863E-06;
var f =-1.291E-08;
var x = document.getElementById("bodyWeight").value;
var inputTotal = document.getElementById("liftTotal").vaule;
//var outputWilks;

function wilksCalculator(bodyWeight, liftTotal) {
    bodyWeight = x;
    return (liftTotal * (500/((a+b*x)+(c(Math.pow(x,2)))+(d+(Math.pow(x,3)))+(e+(Math.pow(x,4)))+(f(Math.pow(x,5))))));

}

var wilks = document.getElementById("outputWilks").innerHTML;
if (wilks) {
    wilks.onsubmit = function () {
        this.wilks.value = wilksCalculator(this.bodyWeight.value, 
        this.liftTotal.value);
        return false;
    };
}

wilksCalculator();

Answer 1

试试这个

<p>
   <label for="bodyWeight">Weight:</label>  
<input id="bodyWeight" type="number" placeholder="Pounds"**/>**
<label for="Big 3 Total">Big 3 Total:</label>
<input id="liftTotal" type="number" placeholder="800" **/>**
<button onclick="wilksCalculator(bodyWeight, liftTotal)">Analyze</button>
</p>
<p>Wilks Coefficient: <span id="outputWilks"></span></p>

Answer 2

我会添加事件监听器，然后获取值并计算。

注意函数c(..中的一些错误是函数调用，假设您想要乘以。与f相同。，检查公式。

将变量从全局范围中取出并放入函数中。修正了一些错别字。

function wilksCalculator(bodyWeight, liftTotal) {
  var a = -216.0475144;
  var b = 16.2606339;
  var c = -0.002388645;
  var d = -0.00113732;
  var e = 7.01863E-06;
  var f = -1.291E-08;
  var x = bodyWeight;
  return (liftTotal * (500 / ((a + b * x) + (c * (Math.pow(x, 2))) + (d + (Math.pow(x, 3))) + (e + (Math.pow(x, 4))) + (f * (Math.pow(x, 5))))));

}

function wilksClick() {
  var wilks = document.getElementById("outputWilks");
  var bodyWeight = document.getElementById("bodyWeight").value;
  var liftTotal = document.getElementById("liftTotal").value;
  wilks.innerHTML = wilksCalculator(bodyWeight, liftTotal);
  return false;
}
var el = document.getElementById("calculate-wilks");
el.addEventListener("click", wilksClick, false);

<body>
  <p>
    <label for="bodyWeight">Weight:</label>
    <input id="bodyWeight" type="number" placeholder="Pounds">
    <label for="liftTotal">Big 3 Total:</label>
    <input id="liftTotal" type="number" placeholder="800">
    <button id="calculate-wilks">Analyze</button>
  </p>
  <p>Wilks Coefficient: <span id="outputWilks"></span></p>
</body>

从HTML获取值并返回另一个

2 个答案: