jquery实现点击input弹出下拉框html:
<input type="text" class="salesInfo" id="fromDeptOut"/>
<ul class="on_changes">
<!-- <li onclick="get('sdf')">sdf</li> -->
</ul>
css:
.on_changes{
position:absolute;
list-style:none;
background:#FFF;
border:1px solid #000;
display:none;
padding:3px;
height: 200px;
overflow-y: scroll;
}
.on_changes li{
margin:0px;
padding:6px;
jquery免费特效下载font-size: 14px;
}
.on_changes li.active{
background:#CEE7FF;
}
js:
$("#fromDeptOut").click(getConfirm);
function getConfirm(){
// 删除,保证每次都是最新的数据
$(".on_changes li").remove();
var arr = [];
callback : function(data){
if(data){
var key;
for(key in data){
arr.push(data[key]);
}
$.each(arr,function(idx,item){
//组装数据
//alert(item);
var li = "<li onclick='get('"+item+"')' onmouseover='this.style.backgroundColor=\"#3082CF\";'onmouseout='this.style.backgroundColor=\"#fff\ ";'>"+item+"</li>";;
//alert(li);
$(".on_changes").append(li);
});
}
},async:false
});
// 控制下拉框显⽰
$(".on_changes").css("width", $("#fromDeptOut").css("width"));//设置加载的下拉列表宽度同输⼊框
var display =$('.on_changes');
if(display.is(':hidden')){//如果node是隐藏的则显⽰node元素,否则隐藏
$(".on_changes").show();
}else{
$(".on_changes").hide();
}
}
function get(data){
$("#fromDeptOut").val(data);
$(".on_changes").hide();
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论