为了账号安全,请及时绑定邮箱和手机立即绑定

关于鼠标移入和点击事件为什么不冲突问题

<div class="clickMe" id="clickMe">猜猜我有啥?<a href="javascrip:void(0);" id="closeBtn"></a></div>

这个a标签被放置到 clickMe中,那么下面点击a标签不是也算鼠标移入到了clickMe中么,不是也应该算触发了鼠标移入事件么,为什么还能隐藏showPic呢

 window.onload = function(){
            var TipBox = document.getElementById("tipCon");
            var ClickMe = document.getElementById("clickMe");
            var showPic = document.getElementById("showPic");
            var closeBtn = document.getElementById("closeBtn");
            ClickMe.onmouseover = function(){
                console.info("clicme");
                showPic.style.display = 'block';
                closeBtn.style.display = 'block';
            }
            closeBtn.onclick = function(){
                console.info("clic");
                showPic.style.display = 'none';
                closeBtn.style.display = 'none';
            }
        }

另外我将tipCon设置了高以后点击关闭按钮就没有用了,这是什么原因?

.tipCon{height:200px;position:fixed;background:#efefef;color:#000;font-size:16px;text-align:center;bottom:0;right:0;}


正在回答

1 回答

当鼠标移入到“关闭”按钮区域时会触发onmouseover事件,然后执行console.info("clicme");语句。(我测试了一下就是这样的)。

onmouseover 事件的特性是“当鼠标经过父元素里的每一个子元素”触发;

建议:你可以看一下http://www.imooc.com/learn/120课程里的第二章第一节

0 回复 有任何疑惑可以回复我~
#1

天之殇 提问者

非常感谢!
2016-11-25 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
网页广告特效
  • 参与学习       40178    人
  • 解答问题       130    个

原来这么EASY,从浅到深,逐步优化代码,让你深入理解

进入课程

关于鼠标移入和点击事件为什么不冲突问题

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信