Javascript事件委托使用分析

本文给出了Javascript事件委托用法的一个示例,供大家参考,具体分析如下:

首先,单击页面的任何部分触发事件。

创建一个script1.js文件。

复制代码代码如下:(函数(){)

eventutility.addevent(文档,点击

警报(你好);

});

}();

页的部分。

复制代码代码如下所示:



















输出:单击页面的任何部分将弹出框。

但是,有时我们希望单击文档中的元素来触发事件。

两。使用委托触发事件

在页面上添加一个标记。

复制代码代码如下所示:























修改script1.js来:

复制代码代码如下:(函数(){)

eventutility.addevent(文档,点击

获取/单击对象

VaR目标= eventutility.gettarget(EVT);

单击tag对象获取的名称。

VaR tagname = target.tagname;

如果标签是

如果(tagname =一){

警报(指向我);

停止默认行为链接

EventUtility.preventDefault(EVT);

}

});

}();

输出结果:只单击页面上的标记弹出框。

上述的优点是,所有的标签都被触发的能力,无论多少个标签元素内添加文件。这样的方式是一个事件委托。我们希望登记为子元素的事件,但在子元素的父元素的第一个登记的事件,使元素在母元,动态添加,任何元素的子元素有相似的已注册事件。

如果我们将事件注册到子元素中,我们将动态添加与文档中的子元素类似的元素。我们必须为这些动态添加的子元素注册事件。

此外,事件委托还可以很好地利用事件冒泡。

希望本文能对大家的javascript程序设计有所帮助。