Умножая переменные, каждый раз получая ответ «0» - PullRequest
0 голосов
/ 17 февраля 2020

Я использую этот код, и он дает 0 ответ каждый раз, когда я нажимаю на кнопку. Вот код.

<input type="text" id="first">
<input type="text" id="second">
<input type="text" id="ans">
<button id="btn">Count</button>
<script>
  var f = document.getElementById('first').value;
  var s = document.getElementById('second').value;
  var ans = document.getElementById('ans');
  var b = document.getElementById('btn');
  b.onclick = function() {
    ans.value = f * s;
  }
</script>

1 Ответ

1 голос
/ 17 февраля 2020

Причина в том, что при нажатии кнопки в исходном коде она выполняется с 0 значениями, поскольку вы не просили их инициировать после каждого нажатия кнопки. Итак, вы пытаетесь сделать так, чтобы и первое, и второе текстовые поля получили свои значения при начальной загрузке страницы, это означает, что эти значения пусты. Итак, когда вы нажимаете кнопку, он получает текущие значения (0) и кратные. Так что всегда 0.

В приведенном ниже примере, что делает @Jacob, он сначала получает целевую кнопку через var b = document.getElementById('btn');, а затем он оборачивает переменные внутри функции click. Поэтому каждый раз, когда вы нажимаете кнопку и вызывается функция, каждая переменная получает текущие значения.

Наконец то, что он сделал, - он, когда вы нажимаете кнопку, он запрашивает для каждой кнопки текущие значения. Таким образом, он также получает текущее значение из элементов.

Просто переместите клик вверх, чтобы он получал новые значения, когда пользователь нажимает.

<input type="text" id="first">
<input type="text" id="second">
<input type="text" id="ans">
<button id="btn">Count</button>
<script>
  var b = document.getElementById('btn');
  b.onclick = function() {
    var f = document.getElementById('first').value;
    var s = document.getElementById('second').value;
    var ans = document.getElementById('ans');
    ans.value = f * s;
  }
</script>

Или получить элементы только один раз.

<input type="text" id="first">
<input type="text" id="second">
<input type="text" id="ans">
<button id="btn">Count</button>
<script>
  var b = document.getElementById('btn');
  var f = document.getElementById('first');
  var s = document.getElementById('second');
  var ans = document.getElementById('ans');
  b.onclick = function() {
    ans.value = f.value * s.value;
  }
</script>
...