javascript变量重置按钮

Question

我正在尝试添加一个按钮，它会改变＆＃34; box1＆＃34;的值。或者＆＃34;价值！＆＃34;我想花费数小时尝试不同的方法，有人可以指出我正确的方向。

＆＃13;

＆＃13;

  <script type="text/javascript">
  
  	function calculate() {
		var value1 = document.getElementById('box1').value;	
		var value2 = document.getElementById('box2').value;
		var result = document.getElementById('result');	
		var myResult = value1 * value2;
		result.value = myResult;
	}
	function reset() {
	 value1 = 0;
	 }
  
  </script>
  
  <div><input id="box1" type="text" /> Value 1</div>
  <div><input id="box2" type="text"  />Value 2</div>
  <div><input id="result" />Answer</div>
  <div><button onclick="calculate()" value="text here" style="width: 139px">Calculate</button></div>
  <div><button onclick="reset()" value="text here5" style="width: 139px">reset</button></div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

如果您想按照自己的风格重置所有字段：

function reset() {
   document.getElementById('box1').value=0; 
   document.getElementById('box2').value=0;
   document.getElementById('result').value=0;   
}

或者，如果您想重用那些将它们声明为全局的变量：

<script type="text/javascript">

var el1;
var el2;
var res;

function calculate() {
    el1 = document.getElementById('box1');  
    el2 = document.getElementById('box2');
    res = document.getElementById('result');    
    var myResult = el1.value * el2.value;
    res.value = myResult;
}
function reset() {
    el1.value = 0;
    el2.value = 0;
    res.value = 0;
}

</script>

Answer 2

在大多数编程语言中，您无法从其他块访问变量：

function reset() {
      document.getElementById('box1').value = 0;
     }

Answer 3

您的重置方法范围内不存在变量value1。它在calculate中定义。

您应该参考重置功能中要重置的框：

document.getElementById('box1').value = 0;

Answer 4

它适用于我;）

function calculate() {
  var value1 = document.getElementById('box1').value;
  var value2 = document.getElementById('box2').value;
  var result = document.getElementById('result');
  var myResult = value1 * value2;
  result.value = myResult;
}

function reset() {
  document.getElementById('box1').value = 0;
  document.getElementById('box2').value = 0;
  document.getElementById('result').value = 0;
}

<div>
      <input id="box1" type="text" />Value 1</div>
    <div>
      <input id="box2" type="text" />Value 2</div>
    <div>
      <input id="result" type="text" />Answer</div>
    <div>
      <button onclick="calculate()" value="text here" style="width: 139px">Calculate</button>
    </div>
    <div>
      <button onclick="reset()" value="text here5" style="width: 139px">reset</button>
    </div>