javascript - 關(guān)于mouseenter的問題
問題描述
<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='http://m.lshqa.cn/wenda/jquery/jquery-3.2.1.js'></script></head><body> <p>只有在鼠標指針穿過被選元素時，才會觸發(fā) mouseenter 事件。</p> <p class='enter'><h2 >被觸發(fā)的 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>
當我用絕對定位把子元素移到下面，這時穿過子元素也會觸發(fā)事件，這是怎么回事？
問題解答
回答1：absolute positioning 只是將元素抽離了 normal flow ，并沒有改變 document tree 的結(jié)構(gòu)，所以子元素依然算是在父元素里面。
解決方法可以是判斷 event.target 是不是子元素，或者改為給兩者綁定 mouseover 然后在子元素里 stopPropagation 。
回答2：根據(jù)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 mouseover, but differs in that it does not bubble, and MUST NOT be dispatched when the pointer device moves from an element onto the boundaries of one of its descendent elements.
翻譯一下就是：
當指針一類的東西移到某個元素的邊界上，或者它的某個后代元素的邊界上，就必須觸發(fā)mouseenter事件。而當指針從某個元素里，移到它的某個后代元素的邊界上時，則不可觸發(fā)mouseenter事件。
所以對于你的問題，回答就是，移到后代上也會觸發(fā)mouseenter是人家規(guī)定了的
相關(guān)文章：
1. macOS Sierra 10.12 安裝mysql 5.7.1出現(xiàn)錯誤2. mysql - 拖拽重排序后怎么插入數(shù)據(jù)庫?3. android - 安卓做前端，PHP做后臺服務(wù)器 有什么需要注意的？4. javascript - 按鈕鏈接到另一個網(wǎng)址 怎么通過百度統(tǒng)計計算按鈕的點擊數(shù)量5. mysql 獲取時間函數(shù)unix_timestamp 問題？6. mysql - 僅僅只是把單引號與反斜杠轉(zhuǎn)義不用prepare statement能否避免sql注入？7. php - 生產(chǎn)環(huán)境下,給MySQL添加索引,修改表結(jié)構(gòu)操作,如何才能讓線上業(yè)務(wù)不受影響？8. mysql主主同步，從庫不同步應(yīng)該怎么解決？9. mysql在限制條件下篩選某列數(shù)據(jù)相同的值10. 新入手layuiadmin，部署到tp中。想用php自已寫一個后臺管理系統(tǒng)。
網(wǎng)公網(wǎng)安備