0

基本上，我想将一个 div 附加到 mouseenter 上的一个元素，然后在同一 parentli的另一个元素的 mouseenter 上附加一个单独的 div 。所以如果一个悬停，追加，然后如果另一个悬停，追加。liulli#div1li#div2

这是我到目前为止所拥有的 

$('ul > li').mouseenter(function (){
      $('#div1').appendTo(this);

      if (('ul > li').mouseenter().not(this)){
         $('#div2')appendTo(this);
      }
});

这仅附加#div1到悬停的li. #div2如果另一个li悬停，我该如何追加？选择.not()器似乎不起作用。提前致谢。

4

2 回答 2

1

我建议如下：

$('li').mouseenter(
    function(){
        var that = $(this),
            i = that.index();
        if (i == 0){
            $('#div1').appendTo(that);
        }
        else {
            $('#div2').appendTo(that);
        }
    });

以上是基于您希望附加#div1到第一个li和#div2所有其他li元素的假设。

针对 OP 的评论进行了编辑（左下方）：

我实际上想在 mouseenter 上附加 #div1 然后如果另一个 li 悬停，我想将 #div2 附加到 #div1 附加到的同一个 li 上。

$('li').mouseenter(
    function(){
        var that = $(this),
            i = that.index();
        if (i == 0){
            $('#div1').appendTo(that);
        }
        else {
            $('#div2').appendTo($('#div1').closest('li'));
        }
    })

参考：

于 2012-05-28T00:41:07.993 回答
0

或者，您可以将 div 放在li元素内，display:none然后在鼠标悬停时显示它们。你可以淡入/等..

CSS

li div {display:none}

HTML

<ul>
<li>Whatever <div>the div </div></li>
<li>Whatever 2<div>the div 2</div></li>
<li>Whatever 3<div>the div 3</div></li>
</ul>

JS

$('li').mouseenter(
function(){
    $('div', this).show(); //
});
于 2012-05-28T03:30:46.637 回答