|
jquery搜索下拉提示框/登陆账号下拉提示框
原创
许琴
2013-12-26 10:20:07
博主文章分类：Jquery
©著作权
文章标签
jquery
搜索下拉提示框
登陆账号下拉提示框
文章分类
jQuery
前端开发
©著作权归作者所有：来自51CTO博客作者许琴的原创作品，请联系作者获取转载授权，否则将追究法律责任
body{font-size:12px;}
.selectItemcont{padding:8px;}
#selectItem{border:1px solid #f00;background:#FFF;position:absolute;top:0px;left:center;overflow:hidden;width:240px;z-index:1000;}
.selectItemhidden{display:none;}
(function($){
$.fn.bgIframe=$.fn.bgiframe = function(s){
return this;
};
})(jQuery);
jQuery.fn.selectCity = function(targetId) {
var _seft = this;
var targetId = $(targetId);
this.click(function(){
var A_top = $(this).offset().top + $(this).outerHeight(true); // 1
var A_left = $(this).offset().left;
targetId.bgiframe();
targetId.show().css({"position":"absolute","top":A_top+"px" ,"left":A_left+"px"});
});
targetId.find("#selectSub :checkbox").click(function(){
targetId.find(":checkbox").attr("checked",false);
$(this).attr("checked",true);
_seft.val( $(this).val() );
targetId.hide();
});
$(document).click(function(event){
if(event.target.id!=_seft.selector.substring(1)){
targetId.hide();
}
});
targetId.click(function(e){
e.stopPropagation(); // 2
});
return this;
}
$(document).ready(function(){
$("#address").selectCity("#selectItem");
})
搜索记录1
搜索记录2
登陆账号3
登陆账号4
清除历史记录...
打赏
赞
收藏
评论
分享
举报
上一篇：《在你身边，为你设计》-哪位知道下载、在线阅读地址啊？
下一篇：HTTP Status 404-项目文件导进来了，打不开？
|