您的位置:首页 > 其它

归纳事件的绑定

2015-11-09 23:06 246 查看
             事件是指:浏览器自动触发或用户手动触发的对象状态的改变。当事件触发时,自动执行的函数我们称为事件的处理函数。在javascript中我们对绑定事件处理函数分为三种:

         ①第一种首先在html页面的标签中:<标签 on事件名="fun(参数)">。为了实现代码和程序分离度,这一种方法在实际开发中,我们并不建议使用。第二种方法在实际的开发中我们用的更多。

fun=function (good){
var div=document.getElementById(good);
div.style.background="red";
}

            这一种方式是通过在html中的标签定义事件的触发条件。

②第二种种方式是在javascript中直接定义事件处理函数 elem.on事件名=函数对象;

③第三种方式同样是在js中定义,不过需要一个绑定的方法:elem.addEventListener(
"事件名",函数对象,是否在捕获阶段触发)。这里需要注意,如:div.addEventListener(onclick,move);中move不能写成move(),addEventListener只不过是对于DOM中在IE8中要改写成为:elem.attachEvent("on事件名",函数对象)

在jQuery中,我们对于事件的绑定同样差不多,只不过在js中我们要改写成elem.事件名=函数对象;另外一种方式就是:  bind(type,data,fn) - 绑定事件

          * type - 指定绑定的事件名称

          * 如果绑定多个事件时,使用空格隔开

         * data - 可选项,作为event.data属性值传递给事件对象的额外数据对象

          * fn - 绑定事件的处理函数

       那么从浏览捕获到事件后,一直到最后一个事件触发完后,这段时间我们称之为事件的周期。事件的周期内,往往会有三个阶段。事件的捕获、目标的触发、事件的冒泡。但是对于IE8浏览器除外,因为IE8浏览器的event,存在于window中,所以IE8只有两个阶段,并没有事件的捕获。

事件的捕获是指:从最外层html元素开始,向内逐层记录每层函数的事件处理函数记录,直到目标元素为止。

目标的触发:自动的触发目标上绑定的事件处理函数。

事件的冒泡阶段:从目标元素的父元素开始,逐级向上执行每一层的事件处理函数,到最外层html元素为止。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: