問題是這樣的：一個div元素要觸發(fā)onmouseout事件，同時這個div內(nèi)部還有子元素，于是當(dāng)鼠標(biāo)移動到該div的子元素上時，onmouseout事件也被觸發(fā)了。在要做浮動層效果的時候會經(jīng)常遇到這個問題。
解決方法一：
使用jQuery，這個大家都會的：

復(fù)制代碼代碼如下:

 
<div id="div1">觸發(fā)顯示浮動層</div> 
<div id="div2"> 
<ul> 
<li>1</li> 
<li>2</li> 
<li>3</li> 
</ul> 
</div> 
<script> 
$("#div1").mouseover(function(){ 
$("#div2").show(); 
$("#div2").bind("mouseleave",function(){ 
$(this).hide(); 
});//此句需要寫在觸發(fā)浮動層的函數(shù)內(nèi) 
};); 
</script> 

解決辦法二：
利用onmousemove事件優(yōu)先的辦法，來防止在子元素中觸發(fā)onmouseout：

復(fù)制代碼代碼如下:

 
<div id="div1" onmouseover="document.getElementById('div2').style.display='block';">觸發(fā)顯示浮動層</div> 
<div id="div2" onmousemove='this.style.display="";' onmouseout='this.style.display="none";'> 
<ul> 
<li>1</li> 
<li>2</li> 
<li>3</li> 
</ul> 
</div> 

您可能感興趣的文章:

相關(guān)文章

淺談Vue3.0之前你必須知道的TypeScript實(shí)戰(zhàn)技巧
這篇文章主要介紹了淺談Vue3.0之前你必須知道的TypeScript實(shí)戰(zhàn)技巧，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-09-09
JS隨機(jī)洗牌算法之?dāng)?shù)組隨機(jī)排序
這篇文章主要介紹了JS隨機(jī)洗牌算法之給數(shù)組隨機(jī)排序的相關(guān)資料,需要的朋友可以參考下
2016-03-03
詳解JavaScript的內(nèi)置對象
本文對JavaScript對象的屬性、對象的方法、對象的屬性、訪問對象屬性的語法進(jìn)行了實(shí)例分析介紹，有需要的朋友可以看下
2016-12-12
小程序?qū)崿F(xiàn)帶索引的城市列表
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)帶索引的城市列表，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-07-07
怎么引入(調(diào)用)一個JS文件
這篇文章主要介紹了引入(調(diào)用)一個JS文的方法，非常不錯介紹的非常詳細(xì)，具有參考借鑒價值，感興趣的朋友一起看看吧
2016-05-05
數(shù)據(jù)排序誰最快(javascript中的Array.prototype.sort PK 快速排序)
今天在51js論壇中看到一個網(wǎng)友發(fā)布了一個javasctipt實(shí)現(xiàn)的快速排序的算法，前些日子工作中也涉及到j(luò)avasctipt中數(shù)據(jù)排序的應(yīng)用，當(dāng)時為了提高排序速度，使用的也是快速排序的算法。
2007-01-01
IE6-8中Date不支持toISOString的修復(fù)方法
這篇文章主要介紹了IE6-8中Date不支持toISOString的修復(fù)方法,需要的朋友可以參考下
2014-05-05
javascript實(shí)現(xiàn)計(jì)算器功能
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)計(jì)算器功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-03-03
JavaScript 聯(lián)動的無限級封裝類,數(shù)據(jù)采用非Ajax方式,隨意添加聯(lián)動
JavaScript 聯(lián)動的無限級封裝類,數(shù)據(jù)采用非Ajax方式,隨意添加聯(lián)動
2010-06-06
JS獲取復(fù)選框的值,并傳遞到后臺的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄狫S獲取復(fù)選框的值,并傳遞到后臺的實(shí)現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-05-05