Question

经过大量令人困惑的研究后，我放弃了试图弄清楚如何为我正在进行的项目编写代码，我希望有人可以帮助我。

我需要为客户的网站创建一个HTML价格报价块。公式需要能够做到这一点：

(Income * 0.01) + ((Property Value + Investments - Debt)*0.005)

所以变量是收入，财产价值，投资和债务。输出需要以美元（$）为单位，并且应至少为150.换句话说，如果有人输入的值等于小于150，则应显示150.

我的尝试如下出了什么问题？

＆＃13;

function calculatePrice(myform){

  //Get selected data 
  var elt = document.getElementById(“income");
  var elt = document.getElementById(“property");
  var elt = document.getElementById(“investments");
  var elt = document.getElementById("debt");
    

    
  //convert data to integers
  income = parseInt(income);
  property = parseInt(property);
  investments = parseInt(investments);
  investments = parseInt(debt);
    
  //calculate total value  
var result=Math.max(income * 0.01 + (property + investments - debt)*0.005, 150);
    
  //print value to  PicExtPrice 
  document.getElementById("PicExtPrice").value=total;

}

＆＃13;

<FORM Name="myform">

  <div>
    <label for="income">Yearly Income</label>
    <input id="income" type="text">
  </div>

  <div>
    <label for="property">Estimated Value of your Asstes (house, land, etc.)</label>
    <input id="property" type="text">
  </div>

  <div>
    <label for="investments">Estimated Value of Investments (stocks, bonds, IRA, etc.)</label>
    <input id="investments" type="text">
  </div>

  <div>
    <label for="debt">Estimated Debt (mortgage, loans, credit cards)</label>
    <input id="debt" type="text">
  </div>

</FORM>

<button type="button" onclick="calculatePrice()">Calculate</button> The new calculated price:
<INPUT type="text" id="PicExtPrice" Size=8>

＆＃13;

View on JSFiddle

Answer 1

基本公式应如下所示：

var result=Math.max(Income * 0.01 + (PropertyValue + Investments - Debt)*0.005, 150);

假设变量已包含相关输入字段的数值。每次更改其中一个输入字段（或每次释放一个键）时，您仍需要确保触发此计算，并将结果写回HTML页面上合适的位置。所有这些都可以通过一些jquery命令轻松完成。

将其写回页面时，您应该使用result.toFixed(2)之类的结果将结果四舍五入到小数点后两位。

修改

我已将您的JSfifddle转移到内部SO-fiddle。您的代码有几个小点错误。看看以下内容并找出差异：

function getv(id){return parseInt(document.getElementById(id).value||0);} function calculatePrice(myform){ // calculate result: var result=Math.max(getv('income') * 0.01 + (getv('property') + getv('investments') - getv('debt'))*0.005, 150); // place the output into the target field: document.getElementById("PicExtPrice").value=result; }

<FORM Name="myform"> <div> <label for="income">Yearly Income</label> <input id="income" type="text"> </div> <div> <label for="property">Estimated Value of your Asstes (house, land, etc.)</label> <input id="property" type="text"> </div> <div> <label for="investments">Estimated Value of Investments (stocks, bonds, IRA, etc.)</label> <input id="investments" type="text"> </div> <div> <label for="debt">Estimated Debt (mortgage, loans, credit cards)</label> <input id="debt" type="text"> </div> </FORM> <button type="button" onclick="calculatePrice()">Calculate</button> The new calculated price:<INPUT type="text" id="PicExtPrice" Size=8>

为了简化操作，我定义了一个小的“getter”函数来检索输入字段值。我只是在编码时讨厌重复自己。因此，getv()返回给定的任何input-id的浮点值。公式没有改变，但是在最后一行中，您尝试引用一个未定义的变量total，它应该是result。

另一个问题可能是某些引号，例如document.getElementById(“income")。注意：第一个“错误，应该是普通的"。

最终修改：

为了使计算更加“宽容”，我在||0之后添加了document.getElementById(id).value。只要输入字段未触及（并返回空字符串），0就会进入。我无法抗拒再缩短整个事情。谁需要income，property等各个变量？当主要公式可以通过直接使用getv()函数来编写时，这只是不必要的错误。

财务规划价格报价计算器

1 个答案: