开发中，有好多地方用到联动菜单，以前每次遇到联动菜单的时候都去重新写，代码重用率很低，前几天又遇到联动菜单的问题，总结了下，发现可以开发一个联动菜单的功能，以后想用的时候就方便多了。项目中每个页面都有引用jQuery，，开发个jQuery联动菜单插件，说动手就动手，下面跟大家分享分享。
我用的jQuery插件方式
(function($){
$.fn.casmenu=function(argvs){
//your code
}
})(jQuery);
其中jQuery传入的是jquery对象，需要在扩展之前引用。在扩展中同样使用jQuery的短格式$。
$.fn是指jquery的命名空间，加在fn上的方法及属性，会对jquery实例每一个有效，看看下面的jquery源码101行左右：
jQuery.fn = jQuery.prototype = {
......
}比如说后面要开发的$.fn.casmenu()，定义之后，在后面的jquery对象都可以使用该方法。
这里还有一种扩展的方法：
$.extend({
funName: function(){
//your code
},
});这种扩展方法和上面的是有区别的，要是拿类做类比的话，$.extend这种方法相当于类中的静态方法，上面的一种方式相当于非静态方法，必须有对象才可以使用。简单的理解，是下面这样的：
//$.fn.casemenu 方式扩展的方法，必须在有jquery对象的时候才可以使用
$("#mydiv").casmenu();//$.extend({}) 方式扩展的方法，可以直接使用
$.add(2,3);
设计思路
首先是层级菜单的数据保存方式，看看下面的数据：
var levels={
//内容中有引号，必须使用单引号，外引号必须用双引号
//name => value
1:{
退出应用: "code1003",
登录界面:"code1004",
跳转至个人资料界面:"code1005",
},
2:{
退出应用:{
应用1:"gameid1",
应用2:"gameid2",
应用3:"gameid3",
应用4:"gameid4",
应用5:"gameid5",
},
跳转至个人资料界面:{
主界面:"main interface",
}
},
3:{
应用1:{
中级场:"12",
高级场:"13",
职业场:"14",
比赛场:"15",
}
}
}
对象levels中的直接键值1、2、3代表菜单的层级，没有就不用些，每一项name=>value代表select中option的名称和value。
层级有规律，某一层级中的某一项要是有下一级菜单，在下一层及有该项的名称，就像levels[1][‘退出应用’]在有下级菜单，就有levels[2][‘退出应用’]，要是继续有下级菜单，就像levels[2][‘退出应用’][‘应用1’]，会在下一层及中继续有levels[3][‘应用1’]。这样一来，就实现了无限级联动菜单，不同的联动菜单只需要修改菜单配置文件就可以了。
