jquery异常问题Uncaught TypeError: $(…).on is not a function

该异常问题出现的原因是在某些情况下，jQuery库未被正确加载或者有冲突，导致jQuery的on方法无法被识别。下面是几种可能的解决方案：

1. 确保正确引入jQuery库

确保在项目的HTML文件中正确引入jQuery库，可以通过CDN链接或者本地下载方式引入。

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

2. 避免与其他库的冲突

当有其他库同时引入时，可能会发生命名空间冲突，导致jQuery的on方法无法被识别。为了避免这种冲突，可以通过引入jQuery库的同时，修改jQuery库的别名，以避免和其他库产生冲突。

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  var $j = jQuery.noConflict();
  //接下来使用$j代替$
</script>

3. jQuery版本问题

另外，可能是jQuery版本问题，因为官方建议使用.on()方法进行事件绑定，而在jQuery3.0之前，可能版本不支持该方法。

下面是两个示例说明：

示例一：引入jQuery库的顺序错误

当 jQuery库放在其他JavaScript库的后面，可能会发生异常：

<script src="js/other-library.js"></script>
<script src="js/jquery.min.js"></script>
<script>
   $(document).on('click', '#test', function() {...});
</script>

在这种情况下，jQuery库的on方法无法被识别，因为它可能在其他JavaScript库的代码执行之前被执行。

解决方案：将jQuery库放在其他JavaScript库之前引入即可。

<script src="js/jquery.min.js"></script>
<script src="js/other-library.js"></script>
<script>
   $(document).on('click', '#test', function() {...});
</script>

示例二：jQuery版本不支持on函数

当jQuery版本低于3.0时，不支持on函数：

<script src="js/jquery-1.11.1.min.js"></script>
<script>
   $(document).on('click', '#test', function() {...});
</script>

在这种情况下，同样会产生该异常问题。解决方案是升级jQuery版本，或者使用旧版支持的事件绑定方式，如：

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
   $('#test').click(function() {...});
</script>

总之，该异常问题要么是jQuery库被正确加载的问题，要么是命名空间冲突的问题，要么是jQuery版本问题，解决方法也因此而异。