jQuery File upload， Uncaught TypeError: Object function ... ... has no method 'widget'

本周在做一个文件上传的模块，用的是jQuery File upload 这个插件，需要引用的js如下：

<script type="text/javascript" src="js/lib/jquery/jquery-2.0.0.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.iframe-transport.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.fileupload.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.ui.widget.js"></script>

但是打开页面的时候浏览器控制台报错：

Uncaught TypeError: Object function ( selector, context ) {// The jQuery object is actually just the init constructor 'enhanced'return new jQuery.fn.init( selector, context, rootjQuery );} has no method 'widget'

绞尽脑汁也想不出为什么报错，因为代码什么的都是照搬网上的。。。

后来再仔细看了看官网的DEMO源码，看到这几个js引用的顺序，似乎有点启发了，会不会是引用的顺序错了，导致后面要用的widget的时候还没加载出来？尝试调换一下这几个js的顺序，来做个测试：

1.把jquery.ui.widget.js放在jquery.fileupload.js的前面

<script type="text/javascript" src="js/lib/jquery/jquery-2.0.0.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.iframe-transport.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.ui.widget.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.fileupload.js"></script>

结果就不报错了。

2.把jquery.ui.widget.js放在jquery.iframe-transport.js的前面：

<script type="text/javascript" src="js/lib/jquery/jquery-2.0.0.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.ui.widget.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.iframe-transport.js"></script>	
<script type="text/javascript" src="js/lib/jquery/jquery.fileupload.js"></script>

正常，不报错。

3.把jquery.ui.widget.js放在jquery-2.0.0.js的前面：

<script type="text/javascript" src="js/lib/jquery/jquery.ui.widget.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery-2.0.0.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.iframe-transport.js"></script>
<script type="text/javascript" src="js/lib/jquery/jquery.fileupload.js"></script>

提示  Uncaught ReferenceError: jQuery is not defined 这个好理解，毕竟jquery-2.0.0.js才是他们几个js的基础嘛。

总结：这里就发现了javascript和java的区别之一，java中只要引用就行，先后顺序无所谓；而javascript却讲究个先后顺序，得先做好前一步的准备才能进行下一步。