JQuery（绑定事件/ 解除事件/触发事件/事件对象）

绑定事件

1.简单事件绑定：    $(selector) .click(handler)     

     

2.bind方式绑定：  1.  bind(“click  mouseenter”, function(){})        //绑定多个相同事件

                             2.bind（{ click：function () {} ,  mouseenter (){  }    }）

     优点：可以同时绑定多个事件

     缺点：仍然无法给动态创建的元素绑定事件

(js中解决动态创建  是在元素创建完成插入到父级元素后 ，给元素绑定事件)

那么该如何给动态创建的元素也绑定事件？事件委托。

 

3.delegate方式绑定（即事件委托）:    $(父元素selector)  .delegate (子元素selector  ，event，handler)   
                               第一个参数：要触发事件的子元素。
                               第二个参数：事件类型
                               第三个参数：事件处理函数

      优点：可以给动态创建的元素绑定事件

      缺点：

事件委托：委托它们父级代为执行事件。指定父级委托事件 去处理程序，用来管理某一类型的所有事件。

 

 

4.on的方式来绑定事件：

       jQuery1.7版本后，jQuery用on统一了所有的事件处理的方法

on注册事件的语法:   $(selector). on(events ,[selector] ,[data] ,handler);

                第一个参数: events, 绑定事件的名称可以是由空格分隔的多个事件(标准事件或者自定义事件)

               第二个参数: selector, 触发事件的后代元素(可选)， 如果没有后代元素，那么事件将有自己执行。

               第三个参数: data, 传递给处理函数的数据，事件触发的时候通过event . data来使用(不常使用)

                第四个参数: handler, 事件处理函数

on注册简单事件：

      $(selector).on( "click", function(){ }) ();          //表示给$(selector)绑定事件，并且由自己触发，不支持动态绑定。

on注册委托事件：

    $(selector).on( "click", "span”, function() { }));

    表示给$(selector )绑定代理事件，当必须是它的内部元素span才能触发这个事件，支持动态绑定

 优点：包括了上面所有绑定事件方式的优点。

 

事件解绑

1.简单事件解绑：      .onclick()  = null ;

2.unbind() 方式         不传参数，解除所有事件

                              传参数，解绑特定事件

3.undelegate() 方式

                              不传参数，解除所有事件

                              传参数，解绑特定事件

4. .off 解绑 on方式绑定的事件 
$(selector).off();            不传参数，解除所有事件

$(selector).off(“click”);    传参数，解绑特定事件
 

 

事件触发

简单事件触发                   $(selector).click();              //触发 click事件

trigger方法触发事件        $(selector).trigger(“click”);

 

 

事件对象：

本质：对 js事件对象的封装，处理了兼容性

screenX和screenY   对应屏幕最左 上角的值

clientx和clientY          页面可视区域的X.Y

pagex和pageY距离页面最 顶部的左上角的位置(会计算滚动条的距离)

 

e. keyCode  按下的键盘代码

e data  存储绑定事件时传递的附加数据

 

e . stopPropagation()阻止事件冒泡行为

e. preventDefault()  阻止浏览器默认行为（阻止a跳转）

return false:既能阻上事件冒泡，又能阻止浏览器默认行为。