返回到mouseout事件jquery上的上一个状态

Question

我有这个小提琴：http://jsfiddle.net/27bvG/

这在鼠标悬停时显示“隐藏”，并保持可见 我对Jquery不太熟练，所以我需要一些帮助。 如何在mouseout上返回上一个状态并再次显示“2个以上”？

感谢所有人！

Answer 1

你可以做那样的事情

     $("#tricky_list li.more").hover(
        function () {
           // hover function       
        }

     },
        function () {
         // unhover function
       }
    );

在悬停功能中，您可以显示不同的li，在取消悬停时，您可以再次隐藏它。

Answer 2

您可以通过处理悬停在“另外两个”LI上时显示的LI的mouseover和mouseout事件来执行此操作。请参阅下面的代码。

查看此演示： http://jsfiddle.net/27bvG/8/

<强> HTML

<ul id="tricky_list">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li class="onmore">Item 4</li>
<li class="onmore">Item 5</li>
</ul>

<强> JS

var hideTimer = -1;
$("#tricky_list li.more").on("mouseover", function(){
    $("#tricky_list li.onmore").show();
    $("#tricky_list li.more").hide()
});
$("#tricky_list li.onmore").on("mouseover", function(){
    clearTimeout(hideTimer);
    hideTimer = -1;
});
$("#tricky_list li.onmore").on("mouseout", function(){
    hideTimer = setTimeout(function() {
        $("#tricky_list li.more").show();
        $("#tricky_list li.onmore").hide();
        hideTimer = -1;
    }, 1000);
});