一、学习内容
使用on()进行事件的绑定
绑定单一事件
$('.box').on('mouseover', function () {
console.log('over')
})
绑定多个事件
$('.box').on({
mouseover: function () {
console.log('over')
},
mouseout: function () {
console.log('out')
},
click: function () {
console.log('click')
}
})
事件委托
优势:动态追加的元素也会有绑定的事件
$(function () {
$('ul').on('click', 'li', function () {
console.log('事件委托')
console.log($(this))
console.log($(this).text())
})
$('button').on('click', function () {
const li = $('<li>我是追加的下雨天~~~</li>')
$('ul').append(li)
})
})
$(function () {
事件的绑定
$('.bd').on({
click: function () {
console.log('click')
},
dblclick: function () {
console.log('dbl')
}
})
})
解绑
$('.jc').on('click', function () {
解除单一事件
$('.bd').off('click')
解除全部事件
$('.bd').off()
})
|