從閃爍連續在內線阻止編輯器上它

Question

我有一個TR裏面，我有一個glyphicon鉛筆一個div。

在TR上鼠標懸停，我顯示的股利。在tr mouseout上，我隱藏了div。

以上所有運作良好。

然而，當鼠標在DIV或glyphicon中，TR保持註冊鼠標懸停和mouseouts，因此glyphicon不斷閃爍。

如何我防止外部物體上造成mouseouts內的對象。

這是我曾嘗試代碼（包括Vue.js）：

<tr v-cloak v-for='res in store.reservations' @mouseover='setShowTools(res)' @mouseout='unsetShowTools(res)' > 
    <td>{{res.entryDate | longToDate | dateOnly}}</td> 
    <td>{{res.fromDate | parseDateOnly | dateOnly }}</td> 
    <td>{{res.toDate | parseDateOnly | dateOnly }}</td> 
    <td>{{res.guestName}}</td> 
    <td>{{res.guestContact}}</td> 
    <td>{{res.numRooms}}</td> 
    <td><div @mousemove.stop @mouseover.stop v-if='res.showTools'><span class="glyphicon glyphicon-pencil"></span></div></td> 
</tr> 

Answer 1

使用鼠標離開，而不是鼠標移開！ Mouseleave不會觸發輸入子元素。

發現，在這個環節的解決方案，但還沒有被標記爲接受的答案。 https://stackoverflow.com/a/30697096/1364747