常见的事件

click,mouseover, mouseout, blur,focus,change, keydown. keyup. resize. scroll等

hover事件

$('.xxx').hover(()=>{
  $('.xxx').slideToggle()
})

事件的绑定 - on

$("div").on({
	mouseenter: function() { 
		$(this).css("background", "skyblue" );
	},
	click: function() {
		$(this).css("background", "purple" );
	},
	mouseleave: function() {
		$(this).css("background", "blue"); 
	}
});

// on事件委派
// ul的事件委托给li去触发
$('ul').on('click','li',()=>{
  console.log(111)
})

事件的解绑 - off

$("p") .off() //解绑p元素所有事件处理程序
$("p") .off( "click") // 解绑p元素上面的点击事件后面的foo是侦听函数名
$("ul") .off ("click", "li"); // 解绑事件委托

事件只触发一次 - one

$('ul').one('click','li',()=>{
  console.log(111)
})

主动触发事件

语法：

元素.事件（）

元素.trigger('事件名')

元素.triggerHandler('事件名') - 不会触发元素的默认行为

$('#btn').click()

事件对象

事件被触发，就有事件对象 的产生

// 阻止默认行为: 
event.preventDefault() 或者 return false
// 阻止冒泡: 
event.stopPropagation()