JQuery3--(jq事件绑定与事件委托)

1. 事件绑定

jq 历史中绑定事件的三种方式

1. on/off
2. bind/unbind
3. live/delegete
   在JQuery1.7之后推出了.on()/.off()，废弃了live()/delegete()方法
   on/off整合了bind/unbind方法
   所以我们使用较多的绑定方法为 on/off

之前使用事件绑定

 $(".btn").click(function () {
   
        console.log("啊~~~");
 });

.on(参数1，参数2，参数3，参数4)

参数1：必填。事件类型，可同时绑定多个事件，仅限于功能相同时，事件之间空格间隔
   事件功能不相同时，可以采用链式编程，在该方法的后面续写
参数2：可选。具体执行功能的 子元素！
参数3：可选。传递到函数内部的数据（类似实参），通过event.data来获取
参数4：必填。具体功能

$(".box").on("click mouseout",".min_box",{
   sum:20},function (e) {
   
        console.log("天气不错");
        //通过参数3 传递进来的参数  我们通过  event.data 来获取
        console.log(e.data.sum);
    });

代码：
显示效果：依次点击第二、第三、第一个div

代码：通过对象的方法添加多个事件

显示效果：

2. 事件的命名空间

有时，我们想对事件进行移除。但对于同名同元素绑定的事件移除往往比较麻烦，这个时候，可以使用事件的命名空间解决
代码：