javascript - 鼠标悬停时显示按钮

Question

上下文

我有一个包含文件夹的 TreeView (.directory):

当我将鼠标悬停在文件夹上时，我会显示/隐藏按钮(.delete 和 .add) .

我需要可以点击这个按钮。

问题

鼠标离开 .directory 时如何让按钮显示？

代码

html :

<li>
    <a class="directory">TEST</a>
    <a class="delete" style="display: none;"></a>
    <a class="add" style="display: none";></a>
</li>

jquery :

$('a.directory').on({
    mouseenter: function() {
        $(this).parent().find('a.delete, a.add').show();
    },
    mouseleave: function() {
        $(this).parent().find('a.delete, a.add').hide();
    }
});

Answer 1

试着把它包裹起来

<div class="directory">
  <a class="value">TEST</a>
  <a class="delete" style="display: none;"></a>
  <a class="add" style="display: none";></a>
</div>

然后当悬停目录时，当你悬停.delete或.add时它仍然会悬停

$('div.directory').on({
    mouseenter: function() {
        $(this).children('a.delete, a.add').show();
    },
    mouseleave: function() {
        $(this).children('a.delete, a.add').hide();
    }
});