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

Question

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

如何同步这两个事件？

$( "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>

Answer 1

我想这就是你想要的。只能在点击后创建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>