如何使用javascript同时触发输入键和按钮

Question

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

<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 键时运行的通用代码，然后将其放入单个函数中，
- 第二，小心，你的输入总是一个字符串，你必须parseInt它才能求和

这是一个工作示例：

<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>