jquery做的无限级菜单
/** *栏目树分级显示下拉菜单组件 *作者:CandySunPlus 孙凤鸣 *example: *var colObj2 = {"Items":[ *{"name":"菜单项目标题1","topid":"0","colid":"1","value":"菜单项目标题1","fun":function(){}}, *... *]} *$("#div").mlnColsel(colObj,{ *title:"栏目下拉菜单", *value:"-1", *width:100 *}); *参数:topid 栏目所属,0为一级 *colid 栏目ID,0为一级 *fun 回调函数 **/ (function($){$.fn.mlnColsel=function(data,setting){var dataObj={"Items":[{"name":"mlnColsel","topid":"-1","colid":"-1","value":"-1","fun":function(){alert("undefined!");}}]};var settingObj={title:"请选择",value:"-1",width:100};settingObj=$.extend(settingObj,setting);dataObj=$.extend(dataObj,data);var $this=$(this);var $colselbox=$(document.createElement("a")).addClass("colselect").attr({"href":"javascript:;"});var $colseltext=$(document.createElement("span")).text(settingObj.title);var $coldrop=$(document.createElement("ul")).addClass("dropmenu");var selectInput = $.browser.msie?document.createElement("<input name="+$this.attr("id")+" />"):document.createElement("input"); selectInput.type="hidden"; selectInput.value=settingObj.value; selectInput.setAttribute("name",$this.attr("id"));var ids=$this.attr("id");$this.onselectstart=function(){return false;};$this.onselect=function(){document.selection.empty()};$colselbox.append($colseltext);$this.addClass("colsel").append($colselbox).append($coldrop).append(selectInput);$(dataObj.Items).each(function(i,n){var $item=$(document.createElement("li"));if(n.topid==0 || n.topid=="0"){$coldrop.append($item);$item.html("<span>"+n.name+"</span>").attr({"values":n.value,"id":"col_"+ids+"_"+n.colid});}else{if($("#col_"+ids+"_"+n.topid).find("ul").length<=0){$("#col_"+ids+"_"+n.topid).append("<ul class=\"dropmenu rootmenu\"></ul>");$("#col_"+ids+"_"+n.topid).find("ul:first").append($item);$item.html("<span>"+n.name+"</span>").attr({"values":n.value,"id":"col_"+ids+"_"+n.colid});}else{$("#col_"+ids+"_"+n.topid).find("ul:first").append($item);$item.html("<span>"+n.name+"</span>").attr({"values":n.value,"id":"col_"+ids+"_"+n.colid});}}});$this.find("li").each(function(){$(this).click(function(event){$colselbox.children("span").text($(this).find("span:first").text());$(selectInput).val($(this).attr("values"));hideMenu();event.stopPropagation();});if($(this).find("ul").length>0){$(this).addClass("menuout");$(this).hover(function(){$(this).removeClass("menuout");$(this).addClass("menuhover");$(this).find("ul:first").fadeIn("fast")var rootdom = $(this);var offset = rootdom.offset();var rootLeft=offset.left+141;var childWidth=$(document).width()-rootLeft;if(childWidth<141){$this.childPath="left"$(this).find("ul:first").css({"left":-100+"px"});}else{$this.childPath="right"$(this).find("ul:first").css({"left":100+"px"});}},function(){$(this).removeClass("menuhover");$(this).addClass("menuout");$(this).find("ul").each(function(){$(this).fadeOut("fast");});});}else{$(this).addClass("norout");$(this).hover(function(){$(this).removeClass("norout");$(this).addClass("norhover");},function(){$(this).removeClass("norhover");$(this).addClass("norout");});}});function hideMenu(){$this.bOpen=0;$(".rootmenu").hide();$coldrop.slideUp("fast");$(document).unbind("click",hideMenu);}function openMenu(){$coldrop.slideDown("fast");$this.bOpen=1;}$colselbox.click(function(event){$(this).blur();if($this.bOpen){hideMenu();}else{openMenu();$(document).bind("click",hideMenu);}event.stopPropagation();});$(".rootmenu").each(function(){if($.browser.msie){$(this).css({"margin-top":"-6px","top":"auto"});}else{$(this).css({"margin-top":"-25px","top":"auto"});}});} })(jQuery);http://dl.iteye.com/upload/attachment/189870/a3caca97-ee45-32aa-98fc-7216bbd546bf.jpg
页:
[1]