EventTarget事件：mouseout

EventTarget事件- mouseout

mouseout當(dāng)指針設(shè)備（通常是鼠標(biāo)）移出已連接或關(guān)閉其子節(jié)點(diǎn)的元素時，會觸發(fā)該事件。請注意，當(dāng)您移動到子元素時，它也會在父元素上觸發(fā)，因為您移出父元素的可見空間。 

基本信息

屬性

示例

以下示例說明了mouseout和mouseleave事件之間的區(qū)別。

<ul id="test">
  <li>item 1</li>
  <li>item 2</li>
  <li>item 3</li>
</ul>

<script>
  var test = document.getElementById("test");
  
  
  // this handler will be executed only once when the cursor moves off the unordered list
  test.addEventListener("mouseleave", function( event ) {   
    // highlight the mouseleave target
    event.target.style.color = "purple";

    // reset the color after a short delay
    setTimeout(function() {
      event.target.style.color = "";
    }, 500);
  }, false);
  
  
  // this handler will be executed every time the cursor is moved off a different list-item
  test.addEventListener("mouseout", function( event ) {   
    // highlight the mouseout target
    event.target.style.color = "orange";

    // reset the color after a short delay
    setTimeout(function() {
      event.target.style.color = "";
    }, 500);
  }, false);
</script>

瀏覽器兼容性

我們將兼容性數(shù)據(jù)轉(zhuǎn)換為機(jī)器可讀的JSON格式。

此兼容性表仍使用舊格式，因為我們尚未轉(zhuǎn)換它包含的數(shù)據(jù)。

• 電腦端

• 移動端

注釋：

[1]僅適用于<textarea>元素和某些<input>元素類型。

[2]在錯誤218093中實現(xiàn)。