Javascript-div div問題

當鼠標移出id1時，需要執行hideall()函數。使用下面的代碼，它會正確調用hideall()，但當鼠標移出id2時，它會再次調用它。Javascript-div div問題

<div id="id1" onmouseout="hideall();" style="border:1px solid red;"> 
      <div id="id2">This is inside id1 div</div> 
</div>

http://i.stack.imgur.com/hrfsM.png

來源

2011-04-16 somedude

mouseout事件我認爲，當來自移動鼠標僅發生某處到某處。如果我理解正確，當鼠標位於id1中時，應該調用代碼中的hideall（），並移出id1外部。你是否聲稱當鼠標從id1（但不是id2） - > id2移動時，hideall（）也會被錯誤地觸發？或者當它從id2-> outside_id2移動時？ – ninjagecko 2011-04-16 20:34:03

當我從id1> id2和id1> body移動鼠標，然後調用hideall（）函數。我需要那個hideall（）函數調用只是如果id1>正文，而不是id1> id2 – somedude 2011-04-16 20:43:07

我已經看到一個非常像這樣的問題：http://jsfiddle.net/userdude/gsv7n/1/ – 2011-04-16 21:38:02

有Internet Explorer中的專有事件稱爲鼠標離開，我相信是你在尋找什麼。不幸的是，這不適用於所有瀏覽器。我建議你使用像jQuery這樣的JavaScript庫。它有內置的活動。有關詳細信息，請參閱http://api.jquery.com/mouseleave/。那麼，你很可能會尋找的是這樣的：

<div id="id1" style="border:1px solid red;"> 
     <div id="id2">This is inside id1 div</div> 
</div> 
<script> 
$(document).ready(function() { 
    $('#id1').mouseleave(function() { 
     hideAll(); 
     // Or whatever else you want to do when the mouse leaves the element. 
    }); 
}); 
</script>

來源

2011-04-16 20:46:30

適應另一種答案我有previously：

<div id="id1" onmouseout="showTarget('id1',0);" onmouseover="showTarget('id1',1);" style="border:1px solid red; width: 150px; height: 100px"> 
<div id="id2" onmouseover="showTarget('id1',1);" onmouseout="showTarget('id1',1);" style="background-color: red; color: white; width: 100px; height: 75px;">This is inside id1 div</div> 
</div> 

function showTarget(target, state) { 
    switch (state) { 
     case 1: 
      state = 'block'; 
     break; 
     default: 
      state = 'none'; 
    } 
    console.log(state); 
    document.getElementById(target).style.display = state; 
}

http://jsfiddle.net/gMpkX/

來源

2011-04-16 21:44:15

Javascript-div div問題

回答

相關問題