目录
一.on()方法
1.使用on()方法
相信我们都不陌生jQuery的on()方法，它可以在匹配元素上绑定一个或者多个事件处理函数，这也是on()方法的一个亮点
$(element).on(events[,selector],callback)
//events:一个或者多个使用空格分隔开来的事件类型
//selector:绑定事件元素的子元素选择器
//callback:回调函数【也就是绑定在元素身上的监听函数】有俩种书写方式，我们分别来演示一下：
$(function(){
$("div").on({
click:function(){
$(this).css("backgroundColor","red")
},
mouseenter:function(){
$(this).css("backgroundColor","yellow")
},
mouseleave:function(){
$(this).css("backgroundColor","")
}
})
})
//$("element").on({事件类型：callback,事件类型：callback,事件类型：callback})<style>
div{
width: 500px;
height: 500px;
background-color: blue;
}
.current{
background-color: aquamarine;
}
</style>
<script>
$(function(){
$("div").on("mouseenter mouseleave",function(){
$(this).toggleClass("current")
})
})
</script>
<body>
<div></div>
</body>
<!--$(element).on("事件类型 事件类型 事件类型"，callback)--!>2.on()方法事件事件委托
$("ul").on("click","li",function(){
console.log("a")
})click点击事件绑定在ul身上，但是触发事件是ul中的li
执行过程：点击li没有过程，但是会开始事件冒泡，冒泡到父级ul，发现父级有li，那么立即执行ul身上绑定事件的回调函数
3.【重点】使用on()方法给未来要创建的元素绑定事件
我们普通的事件绑定是不能给未来创建的元素来绑定事件的，因为一开始没有元素，所以没有查找到
可是使用on()就可以实现未来元素的绑定
假如现在有一个ul的人，他的孩子马上就出生了，我们必须要给即将出生的孩子买新衣服，怎么做才能让提前买好衣服，孩子一出生就可以穿上呢？
<ul></ul>我们给ul即将出生的li绑定事件：
$("ul").on("click","li",()=> {
$("li").css("fontSize","100px")
})孩子出生了，我们看一看孩子有没有穿上新衣服：
const son = $("<li>孩子</li>")
$("ul").append(son)
点击孩子（li），孩子变大了，说明成功
二.off()方法
off()方法可以移除通过on()方法添加的事件处理程序
$("ul").off("click")
//去除ul的点击事件这只是普通on()事件的移除方法，如果是事件委托我们应该怎么解除：
$("ul").off("click","li")解除所有事件处理程序：
$("ul").off()三.one()方法
我们知道了on()绑定、off()解绑，那么one()又是什么？
如果有的事件我们只想触发一次，那么可以利用one()来绑定（取代on()）
四.自动触发事件
叫做自动触发事件，其实就是手动的将on()绑定的事件触发
element.click()
element.trigger("click","传递额外参数值")
element.triggerHandler("click","传递额外参数值")triggerHandler不会触发元素默认行为，并且不会冒泡
五.阻止默认行为以及冒泡
只要事件被触发，那么就会有事件对象的产生
//阻止默认行为
event.preventDefault()
//或者return false
//阻止冒泡
event.stoppropagtion()
1454
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
