javascript - 为什么代码的第一部分无法正常工作，而第二部分却可以正常工作？

Question

<script type="text/javascript">
// first part
document.getElementById("creditBal")
        .addEventListener("keyup", myFunction);

function myFunction() {
  var x = document.getElementById("creditBal");
  var y = document.getElementById("cashBal");
  var z = document.getElementById("totalBal");

  if(y.value == "") {
     z.value = x.value;
  }
  else {
    var tot = parseInt(x.value) + parseInt(y.value);

    z.value = tot + "";
  }
}

// second part
document.getElementById("cashBal")
        .addEventListener("keyup", myFunction);

function myFunction() {
  var x = document.getElementById("creditBal");
  var y = document.getElementById("cashBal");
  var z = document.getElementById("totalBal");

  if(x.value == "") {
    z.value = y.value;
  }
  else {
    var tot = parseInt(x.value) + parseInt(y.value);

    z.value = tot+"";
  }
}
</script>

Answer 1

在上面的代码中，两个函数都被命名为相同的“myFunction”，这导致了歧义。尝试用不同的名称命名函数。甚至 myFunction1 和myFunction2 只是为了区分它们。