js绑定事件的三种方式,js常用的绑定点击事件的方法

　　本教程运行环境：windows7系统，javascript1.8.5版本1.8.5，戴尔G3电脑。

　　1、使用事件源的事件属性绑定处理程序

　　将HTML与JS分开的方法之一是通过使用事件源的event属性来绑定事件处理程序。绑定格式如下：

　　事件处理程序格式中的Obj.on event name=obj是事件源对象。绑定事件程序通常是匿名函数或函数名的定义语句。

　　源的事件属性绑定处理程序示例：

　　OBtn.onclick=function(){//oBtn是事件源对象，其click事件绑定了匿名函数定义。

　　警报(“嗨”)

　　};2、使用addEventListener()绑定处理程序

　　AddEventListener()是标准事件模型中的一个方法，对所有标准浏览器都有效。将事件处理程序与addEvent Liste ner()绑定的格式如下：

　　事件。addEventListener(事件名称，事件处理程序名称，是否捕获)；参数“事件名称”是不带“on”的事件名称；参数“Capture”是一个布尔值，其默认值为false。假的时候会实现事件冒泡，真的时候会实现事件捕获。

　　通过多次调用addEventListener()，可以为事件源对象的同一事件类型绑定多个事件处理程序。当一个对象发生事件时，所有绑定到该事件的事件处理程序都会被调用，并按照绑定的顺序执行。另外，需要注意的是，addEventListener()绑定的事件处理程序中的this指向事件源。

　　addEventListener()绑定处理程序的示例：

　　document . addevent listener( click ，fn1，false)；//点击事件绑定fn1函数，实现事件冒泡。

　　document . addevent listener( click ，fn2，true)；//点击事件绑定fn2函数实现事件捕获3、使用HTML标签的事件属性绑定处理程序

　　需要注意的是，当事件处理程序被HTML标签的event属性绑定时，event属性中的脚本代码不能包含函数声明，可以是函数调用，也可以是一系列用分号分隔的脚本代码。

　　示例：将事件处理程序与HTML标记的事件属性绑定。

　　！声明文档类型

　　超文本标记语言

　　头

　　meta charset=utf-8

　　使用title标记的event属性绑定事件处理程序/标题。

　　/头

　　身体

　　Type= button onclick= var name=张三；alert(name)；Value=事件绑定测试/

　　/body

　　/html上面代码的button是click事件的目标对象，通过标签的event属性onclick绑定了两个脚本代码来处理事件。上述代码在Chrome浏览器中运行后，当用户点击按钮时，会弹出一个警告对话框。

　　【推荐学习：javascript高级教程】以上是javascript事件绑定方法的详细介绍。更多请关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。