为什么 Javascript 不对我的输入值给予一些尊重？

Question

我目前正在开发一个预算软件，我遇到了这个奇怪的错误。首先是我的代码：

<label class="label label-success">Choose your budget</label><br/><br/>

<div class="input-group-addon">€</div>
<input type="number" min="10" max="25000" maxlength="5" step="10" class="form-control" id="Input-budget" placeholder="Amount" onkeyup="this.value=this.value.replace(/[^\d]/,'')" onchange="budCalculate(this.value)">

这是输出行：

<li>
  <strong>
  Total cost: <span id="cost_eur">€0.00 </span> (<span id="cost_usd" class="small">[=12=].00</span>)
  </strong>
</li>

这里是 Javascript:

function budCalculate(budget_amount) {
  var budget = budget_amount;
  cost_eur.innerHTML = "€"+((budget).toFixed(2);
  cost_usd.innerHTML = "$"+ (budget * 1.13 ).toFixed(2);
}

应该把输入的值放在输出线上。

onkeyup 是为了防止人们输入字母。

我尝试了各种变体，有趣的是，几乎相同的相同代码在外观相似的页面上运行。

为什么 JavaScript 不重视我的价值？

Answer 1

我怀疑问题是 budget 不是数字对象。 this.value 将传递一个字符串对象。我建议更改您的功能：

function budCalculate(budget_amount) {
  var budget = 0;
  console.log(typeof budget_amount);
  budget = parseFloat(budget_amount);
  cost_eur.innerHTML = "€" + budget.toFixed(2);
  cost_usd.innerHTML = "$" + ( budget * 1.13 ).toFixed(2);
  return budget;
}

您现在可以看到正在传递的对象类型。 parseFloat() 应该可以解决这个问题。

工作示例：https://jsfiddle.net/Twisty/bqjg50sb/

为什么 Javascript 不对我的输入值给予一些尊重？

Why doesn't Javascript put some respeck on my input value?

javascript

jquery

jquery-ui

jquery-events