为什么单击按钮时会出现“Uncaught ReferenceError: Cannot access 'euro' before initialization”？

Answer 1

我自己弄的。我只需要将 javascript 代码更改为：

function calc() {
  let result = euro.value * 1.1;
  usd.value = result;
}

Answer 2

问题是因为您有一个

id

为

euro

的元素，所以这就是

euro

所引用的内容。这是因为您没有显式声明该变量，因此检查

document

对象以找到匹配的属性，它将作为元素 ID 设置为那里的属性。这是一个非常烦人的遗留行为。由于这个 JS 会混淆你是否试图引用

document.euro

或

euro

变量。

要解决问题并提高代码质量，请明确定义变量并在 HTML 之外使用不显眼的事件处理程序。

此外，对于数学运算，您需要使用

.

作为JS的小数点分隔符才能正常运行。您可以使用全球化方法将其返回到在输出中使用

,

：

const euro = document.querySelector('#euro');
const usd = document.querySelector('#usd');

document.querySelector('#calc').addEventListener('click', () => {
  var eur = parseFloat(euro.value.replace(",",""));
  let result = eur * 1.1;
  usd.value = result.toLocaleString('fr', { // amend culture code as needed
    minimumFractionDigits: 2
  });
});

<div></div>
<form>
  <h1>WÄHRUNGSRECHNER</h1>
  <div></div>
  <div>
    <input id="euro" value="0,00" type="text">
    <label>EUR</label>
  </div>
  <div>
    <input id="usd" value="0,00">
    <label>USD</label>
  </div>
</form>
<button id="calc">Berechnen</button>