简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - 關於mouseenter的問題
滿天的星座
滿天的星座 2017-07-05 10:59:01
0
2
924
<head>
<style>
    .enter h2{
        border:1px solid;
        background: white;
        position: absolute;
        top: 200px;
    }
   .enter{
           border:1px solid;
           background: #eee;
           width: 500px;
           height: 100px;
   }
</style>
<script type="text/javascript" src="jquery/jquery-3.2.1.js"></script>
</head>
<body>
    <p>只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。</p>
    <p class="enter">
        <h2 >被触发的 Mouseenter 事件：<span></span></h2>
    </p>
<script type="text/javascript">
    x=0;
    y=0;
    $(document).ready(function(){
      $("p.enter").mouseenter(function(){
        $(".enter span").text(y+=1);
      });
    });
</script>
</body>

#當我用絕對定位把子元素移到下面，這時穿過子元素也會觸發事件，這是怎麼回事？

滿天的星座
滿天的星座

全部回覆(2)
刘奇
刘奇2017-07-05 11:01:01 2樓

absolute positioning 只是將元素抽離了 normal flow ，並沒有改變 document tree 的結構，所以子元素依然算是在父元素裡面。

解決方法可以是判斷 event.target 是不是子元素，或者改為給兩者綁定 mouseover 然後在子元素裡 stopPropagation 。

點贊 +0
新增回覆
滿天的星座
滿天的星座2017-07-05 11:01:01 1樓

根據https://www.w3.org/TR/uievent...

A user agent MUST dispatch this event when a pointing device is moved onto the boundaries of an element or one of its descendent elements. This event type is similar to monot over, but ders in that s​​nfkwuse not over, sbblen, 週, bblen , 週when the pointer device moves from an element onto the boundaries of one of its descendent elements.

翻譯一下就是：

當指標一類的東西移到某個元素的邊界上，或它的某個後代元素的邊界上，就必須觸發mouseenter事件。而當指標從某個元素裡，移到它的某個後代元素的邊界上時，則不可觸發mouseenter事件。

所以對於你的問題，答案就是，移到後代上也會觸發mouseenter是人家規定了的

點贊 +0
新增回覆
熱門專題
更多>
熱門文章
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網：公益線上PHP培訓，幫助PHP學習者快速成長！