javascript - 如何使用javascript同时触发回车键和按钮

Question

请帮助我了解如何同时触发回车键和按钮。在此代码中，输入中的值必须在同时按 Enter 键和“Enter”按钮时触发相同的值。并且按下按钮后，每次输入字段都会被清除。

<div id="myForm">
  <input type="text" id="bedrag" />
  <button type="button" onclick="check_field('bedrag');" value=''>Enter</button>
  <p>Uw totaal:</p>
  <p id="resultaat"></p>
</div>
<script>
  var totaal = 0;
  var bedrag = document.getElementById("bedrag");
  bedrag.onkeydown = bereken

  function bereken(e) {
    if (e.keyCode == 13) {
      var ingevoerdeBedrag = +document.getElementById("bedrag").value;
      totaal = totaal + ingevoerdeBedrag;
      document.getElementById("resultaat").innerHTML = 'Het bedrag is ' + totaal;
    }
  }

  function check_field(id) {
    var field = document.getElementById(id);
    if (isNaN(field.value)) {
      alert('not a number');
    } else {
      return myFunction();
    }
  }
</script>

Answer 1

有两件事:
- 首先，找到在单击按钮和按 Enter 键时运行的通用代码，然后将其放入单个函数中，
- 其次，请小心，您的输入始终是一个字符串，您必须对其进行解析才能求和

这是一个工作示例:

<div id="myForm">
  <input type="text" id="bedrag" />
  <button type="button" onclick="check_field('bedrag');" value=''>Enter</button>
  <p>Uw totaal:</p>
  <p id="resultaat"></p>
</div>
<script>
  var totaal = 0;
  var bedrag = document.getElementById("bedrag");
  bedrag.onkeydown = bereken

  function submit() {
    var ingevoerdeBedrag = document.getElementById("bedrag").value;
    if (isNaN(parseInt(ingevoerdeBedrag))) {
      alert('not a number');
    } else {
      totaal = totaal + parseInt(ingevoerdeBedrag);
      document.getElementById("resultaat").innerHTML = 'Het bedrag is ' + totaal;
    }
  }

  function bereken(e) {
    if (e.keyCode == 13) {
      submit();
    }
  }

  function check_field(id) {
    submit();

    // Here we're clearing the input only after clicking the button
    document.getElementById(id).value = "";
  }
</script>