-1

我正在使用此代码，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>

4

2 回答 2

1

原因是当您单击原始代码中的按钮时，它会以 0 值执行，因为您没有要求它们在每次按钮单击后启动。所以你想要做的只是第一个和第二个文本文件都会在初始页面加载时获得它们的值，这意味着这些值是空的。因此，当您单击按钮时，它会获得当前值（0）和多个。所以它总是0。

在下面的示例中，@Jacob 所做的是他首先通过获取目标按钮 var b = document.getElementById('btn');，然后将变量包装在 click function 中。因此，每次单击按钮和函数时都会被调用，并且每个变量都会获取当前值。

最后他所做的是，当您单击按钮时，他会询问每个按钮的当前值。所以它也从元素中获取当前值。

只需将 onclick 向上移动，以便在用户单击时获取新值。

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

于 2020-02-17T02:04:35.463 回答
0

这是因为当您将文本放入输入时，它会返回一个字符串。字符串是文本。要将文本变成数字，请将其放入parseFloat函数中。此外，将 onclick 放在 HTML 中。此外，您需要获取函数中的值，因为当页面加载时，输入是空的，但是当您单击按钮时，用户将输入数字。我测试了它，它有效。

<input type="text" id="first">
<input type="text" id="second">
<input type="text" id="ans">
<button id="btn" onclick="clickBtn()">Count</button>
<script>
  function clickBtn() {
    var f = document.getElementById('first').value;
    var s = document.getElementById('second').value;
    var ans = document.getElementById('ans');
    var b = document.getElementById('btn');
    ans.value = parseFloat(f) * parseFloat(s);
  }
</script>
于 2022-03-01T21:55:46.043 回答