Question

我的生产环境中有一个onChange处理程序错误。我有一个选择框如下：

<select name="select-history-one" id="select_old_version" class="form-control" onchange="showHistoryDiff();"> ... </select>

下面（在body标签内）我在脚本标签中声明了如下函数：

<script>
function showHistoryDiff(){
...
}
</script>

在调试模式下我的本地机器上一切正常。只要我将其部署到我的网络服务器并尝试选择一些内容，我就会收到错误消息：

Uncaught ReferenceError: showHistoryDiff is not defined
at HTMLSelectElement.onchange (27:632)
onchange @ 27:632

我真的不知道为什么会这样。

Answer 1

<body>
  <select onchange="doChange()">
   <option>A</option>
   <option>B</option>
  </select>
  
  <script>
    function doChange() {
      console.log('hi');
    }
  </script>
</body>

从这个例子中可以看出，它应该如你所描述的那样工作。

这可能意味着代码不是真正的问题，但更多的是如何加载它。

首先要确保你的功能确实存在。您如何描述它，您应该能够在Chrome中打开控制台并输入showHistoryDiff，它应该输出如下内容：

ƒ showHistoryDiff() { console.log('hi'); }

如果它没有这样说，而是说它是未定义的，那么无论出于什么原因你的代码都没有建立。如果是这种情况，您需要非常仔细地查看构建管道和/或设置，以确保它实际上在您认为应该的位置。

如果确实存在，那么有几种可能性： - 它被其他东西覆盖并变得不确定。在整个代码中查找对函数名称的任何其他引用 - 在声明函数之前会发生一些其他JavaScript语法错误，因此该函数最终未声明

另一个远程可能性是，如果您从两个不同的域加载代码，则可能会遇到跨源（CORS）问题。

查看您的控制台，看看是否有任何错误被吐出。清除它们应该是你的第一个目标。

JavaScript onChange处理程序错误

1 个答案: