使用 jQuery on() 而不是悬停()

Question

根据标准，我尝试为我的事件处理程序尽可能多地使用 jQuery 的 on() 方法。我尝试使用 on('hover') 而不是悬停()，但它不起作用。我该怎么做才能使这段代码与 on() 而不是悬停() 一起使用？是否有我可以看到的与 on() 方法一起使用的事件列表？

$(document).ready(function(){
    $('#navigation li').on('hover', function(){
        $(this).animate({
            paddingLeft: '+=15px'
        }, 200);
    }, function(){
        $(this).animate({
            paddingLeft: '-=15px'
        }, 200);
    });
});

Answer 1

$('div')
  .on('mouseenter', function(){ $(this).addClass('red'); })
  .on('mouseleave', function(){ $(this).removeClass('red'); });

div {
  min-height: 50px;
  border: 1px solid #000;
}

.red { background-color: #F00; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div></div>