Как вызвать клавишу ввода и кнопку одновременно, используя JavaScript - PullRequest
Новая
       34

Как вызвать клавишу ввода и кнопку одновременно, используя JavaScript

0 голосов
/ 13 октября 2019

Пожалуйста, помогите мне понять, как вызвать клавишу ввода и кнопку одновременно. Значение на входе должно сработать одинаково при нажатии клавиши ввода и одновременно на кнопке «Ввод» в этом коде. И после нажатия кнопки, поле ввода будет очищаться каждый раз. 

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

1 Ответ

1 голос
/ 13 октября 2019

Две вещи:
- во-первых, найдите общий код для запуска, как при нажатии кнопки, так и при нажатии клавиши 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>
...