为元素添加hover的事件代理

时间:2025-05-14 22:45:47

$(selector).on(event,childSelector,data,function,map) 在传递到里面的参数中,只可以传一个function

切换class名称模拟

// js
$('ul.course_lists').on('mouseenter mouseleave','li',function(){ 
      $(this).toogleClass('border_color');
});

// css
.border_color{
    border-color:#ccc;    
}

li{
  border:1px solid #fff;
}

利用map模拟(未实现代理)

$('ul.course_lists li').on({
    mouseenter:function(){
        $(this).css('border-color','#ccc');
    },
    mouseleave:function(){
        $(this).css('border-color','#fff');    
    },
    click:function(){
        $(this).css('border-color','#666');
    } 
});