jquery - 将 mouseenter / mouseleave 组合为一个函数

Question

考虑这两个工作函数。有没有办法将这两者串在一起成为一个 jQuery 函数？

$("#help").mouseenter(function(){
    $(this).animate({bottom: '+=100',});
});

$("#help").mouseleave(function(){
    $(this).animate({bottom: '-=100',});
});

Answer 1

见http://api.jquery.com/hover/

$("#help").hover(function() {
    $(this).animate({
        bottom: '+=100',
    });
}, function() {
    $(this).animate({
        bottom: '-=100',
    });
});​

.hover() 方法绑定了 mouseenter 和 mouseleave 事件的处理程序。您可以使用它在鼠标位于元素内时简单地将行为应用于元素。调用$(selector).hover(handlerIn, > handlerOut)是以下的简写：$(selector).mouseenter(handlerIn).mouseleave(handlerOut);

Answer 2

$("#help").on('mouseenter mouseleave', function() {

});

替代使用：

$('#help').hover(
  function() {
     // code for mouseenter 
     $(this).animate({bottom: '+=100',});
  },

  function() {
    // code for mouseleave
    $(this).animate({bottom: '-=100',});
  }
);