函数上的引用错误

问题描述

我只想问一个关于 javascript 的快速问题。我在 w3schools 上看到 onchange on select 来运行一个函数。我还在学习 Javascript 和 jQuery，所以如果我错过了什么，请告诉我。

<select id="mySelect" onchange="myFunction()">
.....
</select>

然后在我的外部 JS 文件上：

$(document).ready(function () {
.....
  console.log("TEST01");
  function myFunction() {
    console.log("TEST02");
  }
.....
});

当我加载页面时，在控制台上，我可以看到 TEST01 打印，但是当我在选择中进行一些更改时，它给了我 ReferenceError myFunction is not defined

解决方法

不要使用内联回调，而是以 jQuery 的方式使用 onChange 侦听 $('#mySelect').on('change',myFunction) 回调

$(document).ready(function () {
  console.log("TEST01");
  
  function myFunction() {
    console.log("TEST02");
  }
  
  $('#mySelect').on('change',myFunction);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select id="mySelect">
 <option>1</option>
 <option>2</option>
</select>

javascript onchange onchange