div+ul下拉菜单jQuery插件

/*
 * //div+ul类型的下拉菜单
 *******************************************
 *默认样式
 *ul.credentials-list-hidden{margin:0;padding:0;}
 *ul.credentials-list-hidden >li{list-style: none;list-style-type: none;overflow: hidden;text-overflow: ellipsis;background-color:#FFF;}
 *ul.credentials-list-hidden >li:hover{background-color:#EFEFEF;}
 *ul.credentials-list-hidden >li:nth-child(odd){background-color:#EFEFEF;}
 *ul.credentials-list-hidden >li{line-height:20px;padding:5px;}
 * 
 * 1、使用例子：
 * 		//******************html代码：****************************
* 		<div class="drop-down-js" data-typeV="1">
			<div class="input-text">大陆身份证</div>
			<!--ul-li插入处-->
		</div>
 * 
 * 		//******************js代码：******************************
 * 		var html='<li data-type="1">大陆身份证</li>'
			+'<li data-type="2">户口本</li>'
			+'<li data-type="3">港澳通行证</li>'
			+'<li data-type="4">护照</li>'
			+'<li data-type="5">出生证</li>'
			+'<li data-type="6">军官证</li>'
			+'<li data-type="7">驾驶证</li>'
			+'<li data-type="8">其他</li>';
			
		$(".drop-down-js").DropDownDivUl({
			LiHtml:html,//(必须)下拉菜单的li的内容
			callback:function(JQobj,text,JQDivObj){
				console.log(text);
				JQDivObj.children(".input-text").text(text);
			}
		})
 * 		
 ********************************************* 
 */
        $.fn.DropDownDivUl=function(options){
		var defaults={
			LiHtml:'',//(必须)下拉菜单的li的内容;
			UlClass:'drop-down-menu',//(可选)li的父元素ul的class名,可用于样式修改，默认为：drop-down-menu;
			zindex:1,//(可选)ul的z-index属性值，防止下拉菜单被遮挡,默认是1;
			Positions:'absolute',
			callback:function(JQobj,text,JQDivObj){
				//(可选)一般都要用到，可用于将选中的结果赋值到自己想要放的地方,callback返回两个结果参数callback(JQobj,text);
		  		//JQobj是指当前被点击的li对象，可以直接用，比如JQobj.attr("data-type");
		  		//text是为了方便直接返回的li包含的内容，其实也可以直接通过JQobj.text()；取得。
		  		//JQDivObj返回的是当前的div对象，可用于赋值等等，多个相同的下拉菜单时用于区分相同class的不同的对象
			}
		};
		var opts = $.extend({},defaults,options || {});
		if(!opts.UlClass){
			console.log("UlClass不能为空!");
			return;
		}
		return this.each(function(i){
			var JQueryDivClass=$(this);
			JQueryDivClass.find("."+opts.UlClass).remove();
			JQueryDivClass.append('<ul style="display:none;" class="credentials-list-hidden '+opts.UlClass+'">'+opts.LiHtml+'</ul>');
			var JQueryUlClass=$("."+opts.UlClass).eq(i);
			JQueryDivClass.off("click").on("click",function(event){
				var event=event||window.event;
				event.stopPropagation();//阻止冒泡事件
				
				var DivHeight=JQueryDivClass.outerHeight(false);
				var DivWidth=JQueryDivClass.outerWidth(false);
				var DivTop=JQueryDivClass.offset().top;
				var DivLeft=JQueryDivClass.offset().left;
				var borderLeft= JQueryDivClass.css("border-left");
				var borderRight= JQueryDivClass.css("border-right");
				var borderLeftWidth=parseFloat(JQueryDivClass.css("border-left-width"));
				var borderRightWidth=parseFloat(JQueryDivClass.css("border-right-width"));
				var FixedDivTopBrowser=JQueryDivClass[0].getBoundingClientRect().top;//元素相对于可视窗口的高度;
				var FixedDivLeftBrowser=JQueryDivClass[0].getBoundingClientRect().left;//元素相对于可视窗口的左距离;
				//alert(borderLeftWidth);
				//alert(DivLeft);
				var windowHeight=$(window).height();
				var windowWidth=$(window).width();
				var DocumentHeight=$(document).height();
				var WindowScrollTop=JQueryDivClass.scrollTop();
				var UlHeight=JQueryUlClass.height();
				var zindexX=opts.zindex;
				if(opts.Positions=='absolute'){
					if((DivHeight+DivTop+UlHeight)>DocumentHeight){
						JQueryUlClass.css({"z-index":zindexX,"position":opts.Positions,"left":DivLeft,"top":DivTop-UlHeight,"width":DivWidth-(borderLeftWidth+borderRightWidth),"border-left":borderLeft,"border-right":borderRight});
					}else if((DivHeight+DivTop+UlHeight)<=DocumentHeight){
						JQueryUlClass.css({"z-index":zindexX,"position":opts.Positions,"left":DivLeft,"top":DivHeight+DivTop,"width":DivWidth-(borderLeftWidth+borderRightWidth),"border-left":borderLeft,"border-right":borderRight});
					}else{
						JQueryUlClass.css({"z-index":zindexX,"position":opts.Positions,"left":DivLeft,"top":0,"width":DivWidth-(borderLeftWidth+borderRightWidth),"border-left":borderLeft,"border-right":borderRight});
					}
				}else if(opts.Positions=='fixed'){
					if(DivHeight+FixedDivTopBrowser+UlHeight<=windowHeight){
						JQueryUlClass.css({"z-index":zindexX,"position":opts.Positions,"left":FixedDivLeftBrowser,"top":FixedDivTopBrowser+DivHeight,"width":DivWidth-(borderLeftWidth+borderRightWidth),"background-color":"#FFF","border-left":borderLeft,"border-right":borderRight});
					}else{
						JQueryUlClass.css({"z-index":zindexX,"position":opts.Positions,"left":FixedDivLeftBrowser,"top":FixedDivTopBrowser-UlHeight,"width":DivWidth-(borderLeftWidth+borderRightWidth),"background-color":"#FFF","border-left":borderLeft,"border-right":borderRight});
					}
				}
				$("."+opts.UlClass).not(JQueryUlClass).slideUp("slow");
				JQueryUlClass.slideToggle("slow");
			});	
			
			JQueryUlClass.children("li").off("click").on("click",function(event){
				var event=event||window.event;
				event.stopPropagation();//阻止冒泡事件
				if(opts.callback){
					opts.callback($(this),$(this).text(),JQueryDivClass);
					//alert($(this).text());
				}
				JQueryUlClass.slideUp("slow");
			})
			$(document).on("click",function(){
				JQueryUlClass.slideUp("slow");
			});
		})
		
	}