千锋教育JavaScript全套视频教程(10天学会Js,前端javascrip

jquery事件的绑定方式有以下几种:
+ on()
1. 绑定点击事件,事件冒泡机制仍然存在(这种绑定后续新加入的同类型的节点就不会有这个事件了)
```js
$('ul').on('click',function(){
console.log('ul click');
})
```
2. 事件委托:给某个元素绑定事件。后续加入的相同的节点也可以有这个事件,只需要在on的第二个参数处传递一个标签元素即可
```js
$('ul').on('click', 'button', function () {
console.log('ul click');
})
```
3. 传参数(必须是一个对象)
```js
$('ul').on('click', {name:'karvin'}, function (e) {
console.log(e);
})
```
4. 事件委托+传参(传参的形式随意)
```js
$('ul').on('click', 'button',{name:'karvin'}, function (e) {
console.log(e);
})
```
+ one
- 一次性事件,点击完成之后就会解绑
```js
$('ul').one('click','button',function(){
console.log('ul');
})
```
+ 常用的方法函数
click(),mouseover(),mouseout(),blur(),change(),input()
- 也支持链式绑定
- 传递参数,参数形式可以多样
```js
$('ul li').click({name:'karvin'},function(e){
console.log('click',e.data);
}).mouseover({name:'karvin'},function(e){
console.log('mouseover',e.data);
})
```
+ off()
- off():解绑所有的事件
- off('click'):解绑click事件
- off('click',"要解绑的处理函数名")
```js
function A(){
console.log('AAA');
}
function B(){
console.log('BBB');
}
$('ul li').on('click',A).on('click',B)
$('ul li').off('click',A)
```
+ 补充知识点:普通节点转换成jquery节点
- document ---> $(document)
原生js绑定事件和解绑事件的回顾:
jquery的绑定事件与解绑事件与原生js的绑定事件的方式不太一样,原生js绑定事件有两种方式:第一个是on+事件类型的方式,第二个是addEventListener的方式。解绑的方式两种不同的绑定当时也有不同的解绑方式。第一种方式的解绑方式只需将其置空就可,第二种方式需要使用removeEventListener才可。