$(...).nicescroll is not a function报错分析

问题描述：

浏览器报$(...).niceScroll is not a function的错。

问题分析：

将echarts.js删除后，此报错没了，初步判断是两个js冲突引起。

将echarts放在最后时，也无报错，但是页面重复加载后还会有报错。

后查看nicescroll.Js文件

适配amd的jquery扩展时会有如下书写：

(function(f){"function"===typeof define && define.amd ? define(["jquery"],f) : f(jQuery)})(function(f){...})

NVIDIA显卡先加载nicescroll的时候是type define 为undefined；会走f(jQuery)此时正常无报错。

 

但是查看echarts.js 时发现里面定义了define对象，如下图：

并且若是在加载echarts之后再加载nicescroll时取到的define是echarts里的define对象，并且define.amd为一个object对象，如下图

会影响到nicescroll.js的判断而走amd的jquery对象define(["jquery"] , f)，但实际上是NVIDIA，所以这个jquery对象不合适，从而导致里面扩展的nicescroll()方法无法生效，产生$(...).nicescroll() is not a function的报错。

解决办法：

 

一、若页面无重复加载js

解决办法：

直接将nicescroll.Js放在echarts.js前面加载即可。

 

二、若页面有重复加载（即 虽然nicescroll放在了echarts前面，但是页面重复加载后会再次加载nicescroll，此时已经有了echarts里的define对象，会影响对于amd的判断）

快速解决方法：

不考虑amd判断时，去掉"function"===typeof define&&define.amd判断直接走f(jQuery)即可。

Ps:没有amd的显卡所以未做amd测试，so...对amd的影响未可知。

完美解决办法：

全部替换echarts里面的define对象和方法--包含下方所有js对应调用的define方法

Ps:全部替换的注意里面有undefined字段影响全部替换，可将undefined全部替换为别的不影响替换的字段如undifined，之后再替换define为define_echarts，最后将undifined替换回undefined即可。

请尊重原创！转载请注明出处！谢谢