//模拟下拉框
$(".Js_dropMod").each(function(){
var _this=$(this)
//_this.find(".Js_hiddenVal").val("")
var curObj=_this.find(".Js_curVal");
if(curObj.find("input:text").length<=0){
var curText=curObj.text();
curObj.html("");
curObj.append("<input type=‘text‘ value=‘"+curText+"‘ />")
}
//_this.find(".Js_hiddenVal").val("")
_this.find(".Js_hiddenVal").attr("normal",_this.find(".Js_curVal").find("input:text").val())
_this.hover(function(){
_this.find(".Js_hiddenVal").attr("normal",_this.find(".Js_curVal").find("input:text").val())
//添加zIndex的值是为了兼容IE8以下浏览器层级
_this.css("zIndex","999")
_this.parents(".pop-conlists").css("z-index","2")
if(_this.find(".select-list").find("li").length<=0) return;
_this.find(".select-list").show().find("li").show();
if(_this.parents(".search-mod").length>0){
_this.parents(".search-mod").eq(0).css("z-index",5)
}
},function(){
_this.css("zIndex","999")
_this.find(".select-list").hide().find("li").removeClass("hover");
if(_this.parents(".search-mod").length>0){
_this.parents(".search-mod").eq(0).css("z-index",1)
}
})
//添加hover方法
_this.find("ul li").each(function(){
$(this).hover(function(){
$(this).addClass("hover").siblings("li").removeClass("hover")
},function(){
$(this).removeClass("hover")
}).click(function(e){
var that=$(this).find("a")
_this.find(".Js_hiddenVal").attr("normal",that.text());
if(that.parents("ul").siblings(".Js_curVal").find("input:text").length<=0){
that.parents("ul").siblings(".Js_curVal").text(that.text()).css("color","#5A5A5A")
}
else
{
that.parents("ul").siblings(".Js_curVal").find("input:text").val(that.text()).css("color","#5A5A5A")
}
that.parents("ul").siblings(".Js_hiddenVal").val(that.attr("rel"))
that.parents("ul").siblings("label.error").remove();
that.parents("ul.select-list").hide()
//e.preventDefault();
//e.stopImmediatePropagation()
})
})
})
<!-- <div class="shortcut">
<span class="left-t">应用插件:</span><div class="Js_dropMod select-box inline-select select-200 ">
<input type="hidden" class="Js_hiddenVal" id="deleteflag" name="deleteflag" value="1"/>
<span class="Js_curVal">请选择</span>
<ul class="select-list">
<li class="select-item" onclick="loadDeleteflag(‘1‘)" ><a href="javascript:void(null)" rel="1">企业通讯录android版企业通讯录android版</a></li>
<li class="select-item" onclick="loadDeleteflag(‘2‘)" ><a href="javascript:void(null)" rel="2">企业通讯录android版</a></li>
<li class="select-item" onclick="loadDeleteflag(‘3‘)" ><a href="javascript:void(null)" rel="3">企业通讯录android版</a></li>
</ul>
</div>
<span class="left-t">应用:</span><div class="Js_dropMod select-box inline-select select-200 ">
<input type="hidden" class="Js_hiddenVal" id="deleteflag" name="deleteflag" value="1"/>
<span class="Js_curVal">请选择</span>
<ul class="select-list">
<li class="select-item" onclick="loadDeleteflag(‘1‘)" ><a href="javascript:void(null)" rel="1">企业通讯录android版企业通讯录android版</a></li>
<li class="select-item" onclick="loadDeleteflag(‘2‘)" ><a href="javascript:void(null)" rel="2">企业通讯录android版</a></li>
<li class="select-item" onclick="loadDeleteflag(‘3‘)" ><a href="javascript:void(null)" rel="3">企业通讯录android版</a></li>
</ul>
</div>
</div> -->
/*表单模拟select*/
.select-box{ position:relative;float:left; width:80px;padding: 0 26px 0 12px;border:1px solid #BFBFC0; height:22px;line-height:22px; background:url(../images/icon/icon_down.png) no-repeat right center #fff; text-align:left;}
.select-box .Js_curVal input,.Js_curVal input[type=text]{ width:100%; height:24px; border:none;}
input:focus{outline:none;}
.select-box.w90{width:90px}
.select-list{ background:#F0F0F0}
.select-box.w90 .select-list{ width:128px;border-color:#ddd}
.w30{width:30px}
.w30 .select-list{ width:68px;border-color:#ddd}
.select-box.w80{width:80px}
.select-box.w80 .select-list{ width:118px;border-color:#ddd}
.select-box span{display:inline-block;*display:inline;*zoom:1;height:22px;line-height:22px;overflow:hidden; width:100%;font-size:12px;}
.select-list{ display:none; position:absolute; z-index:5;left:-1px;top:22px; border:1px solid #ddd; white-space:nowrap; overflow:auto; max-height:300px;}
.select-list .select-item{ *zoom:1; padding:0px 10px 0px 12px;}
.select-list .select-item.indent{text-indent:5px;}
.select-list .select-item.bold{font-weight:700;font-style: oblique;}
.select-list .hover{/*background-color:#6BADEA;*/ color:#6888B9; cursor:pointer;}
.select-item a:link,.select-item a:visited{padding:0px; word-break: break-all;word-wrap: break-word;display:inline-block;*display:inline;*zoom:1;font-size:12px;}
.select-item a.snode{font-style:none;float:left; text-decoration:none;}
.select-item a:hover,.select-item a:active{ color:#fff;}
.select-item s{ text-decoration:none;}
.select-list .hover{*zoom:1;}
.select-list .hover a:link,.select-list .hover a:visited{display:inline-block;*display:inline;*zoom:1;/*background-color:#6BADEA;*/color:#6888B9;}
.main-hd .select-list .hover a:link,.main-hd .select-list .hover a:visited{display:block;}
.select-box label.error{ margin-top:2px;}
.Js_coverDropMod{cursor:pointer;}