jQuery事件

主要内容：

1.在页面就绪时执行js代码；

2.处理用户事件，如：鼠标单击、按下键盘；

3.文档中的事件流，以及操纵事件流；

4.模拟用户发起的事件。

一：在页面就绪时执行js代码

     1.  .ready()方法，$(document).ready() 是jQuery基于页面加载执行任务的一种主要方式，它和原生的window.onload事件很相似，但却有差异。$(document).ready()注册的事件处理程序，会在HTML下载并解析为DOM树之后执行；而window.onload事件处理程序需要在所有的资源文件（图片等文件）加载完毕之后执行。.ready()的方法的简写：$(document).ready(function(){})  <=> $(function(){})；另外，一个页面可能引入很多js库文件，为了避免和其他库文件的$符有冲突，我们可以向.ready()放回调函数中传入参数，如：jQuery(document).ready(function($){})。

二：处理简单的事件：

       我们主要引入.on()方法，这样，我们就可以指定任何DOM事件，并为该事件添加一种行为。如：给拥有class类名为box的元素添加鼠标单击事件 

       $('.box').on('click',function(){

            alert('aa')

       });

     this在事件处理程序中的使用：关键字this引用的都是携带相应行为的DOM元素。this和DOM元素一样，可以作为$()的参数，$(this)就如同使用css选择符找到该元素一样。

     jQuery总是按我们注册事件的顺序，来触发事件处理程序。因此，同一个DOM元素可以多次绑定同一个或者不同的事件，并且事件的处理程序会按绑定的顺序执行。

     简写的事件：$('.box').click(function(){});blur、keydown、scroll等标准的DOM事件都可以这样写。

三：事件传播

     1.事件冒泡：当事件发生时，会首先发送给最具体的元素，在这个元素获得相应机会之后，事件会向上冒泡到更一般的元素。

     2.事件捕获：当事件发生时，会首先交给最外层的元素，接着再交给更具体的元素。

     3.浏览器最终出台的DOM标准：首先，事件要从一般元素到具体元素逐层捕获，然后，事件再通过冒泡返回DOM树的顶层。

     4.事件目标：事件对象event中的target属性保存着事件的目标元素，由于jQuery对事件对象进行了必要的扩展，从而在任何浏览器中都能够使用这个属性。通过.target可以确定DOM中首先接收到的事件元素       （实际呗点击的元素）。

     5.停止事件传播：.stopPropagation()方法，该方法可以完全阻止事件冒泡。事件冒泡会有一些副作用，所以此方法很有用。

     6.阻止默认操作：.preventDefault()可以阻止默认事件，如a标签的跳转。

     7.事件委托：当多个元素需要添加同一个事件时，我们可以给其祖先元素上指定一个点击处理程序，然后再判断事件的目标是否是我们要求的元素，判断时可以使用.is()函数，这个函数可以判断调用者是否包         含某个选择符表达式。原理：事件冒泡。

     8.移除事件处理程序：.off()方法可以移除事件处理程序。

     9.内置事件委托：

       一般的事件绑定会有一个弊端，就是给拥有box这个class类的DOM绑定鼠标单击事件，在ajax异步请求到数据之后，再去创建拥有box这样class类的DOM，此时新建的DOM是没有绑定上鼠标单击事件的。

      内置事件委托的方法可以解决这个问题：下面的代码中，jQuery给document绑定了鼠标单击事件，同时会比较event.target和选择符表达式‘.box’，如果匹配jQuery会把this关键字映射到匹配的元素上。否则         不会执行事件处理程序。

      $(document).off('click','.box').on('click','.box',function(){

              alert('aa')

      });

另一种方法：

$(“.parent”).delegate(“.child”,”click”,function(){

alert('aa');

        })

    10.为事件处理程序添加命名空间：$(document).off('click.myClick','.box').on('click','.box',function(){});其中.myClick是自己定义的，事件处理系统是看不见的。

        为事件处理程序添加命名空间之后，.off()移除事件时会更有针对性，DOM元素多次绑定了事件的处理程序，但是需要只移除其中的鼠标单击的事件处理程序，此时命名空间就用处很大了。

四：模仿用户操作

    1.无需用户操作就能触发事件，即模仿事件操作，.trigger()函数是jQuery模拟事件操作的函数，传参为字符串：.trigger('click');也有简写的方法：.click()  .blur()等等。

    2.响应键盘事件：键盘事件有keypress 、keydown、keyup；想知道用户按了哪个键，应该侦听keyup或者keydown事件，想知道用户输入的啥字符，应该侦听keypress事件;