jQuery: 仿select下拉框效果，点击空白关闭弹出层，判断是否被mouseover
83510998 2015-05-19
1. 方法一
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="http://www.w3cschool.cn/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$(".btn").click(function(e){
e.stopPropagation();
$("#box").show();
});
$("#box").click(function(e){
e.stopPropagation();
});
document.onclick = function(){
$("#box").hide();
};
})
</script>
<style>
#box {width:300px;height:200px;border:1px solid #000;display:none}
</style>
</head>
<body>
<div id="box"></div>
<span class="btn">显示层</span>
</body>
</html>2. 方法二
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="http://www.w3cschool.cn/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$(".btn").click(function(){
$("#box").show();
return false;
});
$("#box").click(function(){
return false;
});
document.onclick = function(){
$("#box").hide();
};
})
</script>
<style>
#box {width:300px;height:200px;border:1px solid #000;display:none}
</style>
</head>
<body>
<div id="box"></div>
<span class="btn">显示层</span>
</body>
</html>来源：http://bbs.blueidea.com/forum.php?mod=viewthread&tid=3056515&page=1#pid5427170
3. 判断元素是否被mouseover
$('#test').click(function() {
if ($('#hello').is(':hover')) {
alert('hello');
}
});或者
if ($('#element:hover').length != 0) {
// do something ;)
}来源：http://stackoverflow.com/questions/1273566/how-do-i-check-if-the-mouse-is-over-an-element-in-jquery
相关推荐
suis 0喜欢 / 0评论 2014-01-13
Hhjian 0喜欢 / 0评论 2014-05-31
83457317 0喜欢 / 0评论 2012-02-05
我只是个程序员 0喜欢 / 0评论 2015-09-11
87443561 0喜欢 / 0评论 2015-08-10
suis 0喜欢 / 0评论 2015-05-11
DevilPace 0喜欢 / 0评论 2014-05-31
momode 0喜欢 / 0评论 2014-04-29
81423067 0喜欢 / 0评论 2014-03-12
lkj0 0喜欢 / 0评论 2014-01-13
无情 0喜欢 / 0评论 2013-08-20
海欣海夜 0喜欢 / 0评论 2013-04-18
89203856 0喜欢 / 0评论 2012-04-17
AnneZhao 0喜欢 / 0评论 2011-11-23
zhangyang0 0喜欢 / 0评论 2011-09-15
愚盦 0喜欢 / 0评论 2011-08-21
zfjdoreen 0喜欢 / 0评论 2011-03-30
83457317 0喜欢 / 0评论 2011-03-03
zhangmingming 0喜欢 / 0评论 2017-07-26
83284158 0喜欢 / 0评论 2018-07-14
张小程 0喜欢 / 0评论 2016-09-22
soulis 0喜欢 / 0评论 2016-04-03
gxr 0喜欢 / 0评论 2017-01-23
刘阿飞 0喜欢 / 0评论 2017-01-23
waterv 0喜欢 / 0评论 2016-12-29
warhin 0喜欢 / 0评论 2016-12-22
86403563 0喜欢 / 0评论 2016-09-14
87374459 0喜欢 / 0评论 2015-04-29
sunnylin 0喜欢 / 0评论 2019-04-26
81473560 0喜欢 / 0评论 2016-05-24
88417615 0喜欢 / 0评论 2019-04-25
钱多多 0喜欢 / 0评论 2019-04-25
yaasshole 0喜欢 / 0评论 2019-04-23
seoppt 0喜欢 / 0评论 2015-10-15
83991231 0喜欢 / 0评论 2015-10-12
前端档案 0喜欢 / 0评论 2015-10-12
warhin 0喜欢 / 0评论 2015-09-19
87407607 0喜欢 / 0评论 2015-09-19
yaasshole 0喜欢 / 0评论 2019-04-21
81971235 0喜欢 / 0评论 2019-04-20
mengyun00 0喜欢 / 0评论 2019-04-20
yangmingxing0 0喜欢 / 0评论 2013-12-27
xiongfeng 0喜欢 / 0评论 2015-03-25
草莓酱 0喜欢 / 0评论 2015-02-20
mengyun00 0喜欢 / 0评论 2019-04-20
83991231 0喜欢 / 0评论 2019-04-20