javascript - parseInt() 的未定义值

Question

我正在学习 Javascript 事件，但我对在输入中键入的值有疑问。

当我键入一个数字时，计算需要更改(键盘输入)。我选择的选项(更改)也是如此。

但是我的段落 (id=res) 返回的值是不确定的。我不明白这是什么意思以及如何调试它。

// Here is the Javascript for my events (keyup and change).

document.getElementById("selectDevice").addEventListener('change', change);
document.getElementById("montant").addEventListener('keyup', change);

function change(e) {
  var montant = Number.parseInt(document.getElementById("montant").value, 10);
  var selectDevice = document.getElementById("selectDevice").value;
  switch (e.target.id) {
  case 'nothing':
    var resultat = montant;
    console.log(resultat);
    break;
  case 'usd':
    var resultat = montant * 1.14;
    console.log(resultat);
    break;
  case 'eur':
    var resultat = montant * 0.82;
    console.log(resultat);
    break;
  }
  document.getElementById("res").innerHTML = resultat
}

<!-- Here is the HTML -->

Amount: <input id="montant" type="text" />
Device: 
<select id="selectDevice">
  <option id="nothing" value="nothing">Please choose a device</option>
  <option id="usd" value="eur">EUR</option>
  <option id="eur" value="usd">USD</option>
</select>
Convert amount: <span id="res"></span>

我说的是法语，我没有翻译我所有的代码，但如果你有任何问题，我在这里 =)

如果你有Javascript文档中的一些解决方案，谢谢你给我页面，因为我需要学会在文档中搜索才能自己找到我的解决方案。

祝你有美好的一天=)

Answer 1

您的 switch 语句正在查看触发它的元素的 ID，这有两个问题:

1. 当触发变化的元素不同时，切换结果不同——您希望切换只与选择框相关。
2. ID 实际上并不重要 - 它是您要检查的值，并且您已经将其用作 selectDevice。

这只需要一个小的修复:

// Here is the Javascript for my events (keyup and change).

document.getElementById("selectDevice").addEventListener('change', change);
document.getElementById("montant").addEventListener('keyup', change);

function change(e) {
  var montant = Number.parseInt(document.getElementById("montant").value, 10);
  var selectDevice = document.getElementById("selectDevice").value;

  switch (selectDevice) { // changed this and that was it.
  case 'nothing':
    var resultat = montant;
    console.log(resultat);
    break;
  case 'usd':
    var resultat = montant * 1.14;
    console.log(resultat);
    break;
  case 'eur':
    var resultat = montant * 0.82;
    console.log(resultat);
    break;
  }
  document.getElementById("res").innerHTML = resultat
}

<!-- Here is the HTML -->

Amount: <input id="montant" type="text" />
Device: 
<select id="selectDevice">
  <option id="nothing" value="nothing">Please choose a device</option>
  <option id="usd" value="eur">EUR</option>
  <option id="eur" value="usd">USD</option>
</select>
Convert amount: <span id="res"></span>