JQUERY:通过单击和悬停隐藏项目

JQUERY: Hide item with click and hover

我需要 select 第一个列表中的第一项并隐藏该元素。当鼠标经过时隐藏列表的第一个元素后。

如何同步这两个事件?

$( "dt" ).click(function() {
  $( this ).slideUp(500);
});
$( "dd" ).hover(function() {
  $( this ).delay(2000).slideUp(500);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

<dl>
  <dt>list</dt>
  <dd>one</dd>
  <dd>two</dd>
  <dd>three</dd>
</dl>

我想这就是你想要的。您只能在点击后创建 hover 事件。

$( "#first" ).click(function() {
    $( this ).delay(2000).slideUp(500);
    
     $( "dt" ).hover(function() {
         $(this).siblings("dd").hide();
     });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

<dl>
    <dt>list</dt>
    <dd id="first">one</dd>
    <dd>two</dd>
    <dd>three</dd>
</dl>