事件绑定,就是要对某一个东西进行操作。(因为你想让他实现什么效果,所以就得绑定他,哈哈哈!)
要想让 javascript 对用户的操作作出响应,首先要对 dom 元素绑定事件处理函数。所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称。
在javascript中,有三种常用的绑定事件的方法:
在dom元素中直接绑定;
在javascript代码中绑定;
绑定事件监听函数。
1、用例子的形式来给大家解释一下,如何在dom元素中直接绑定。
单击一个按钮,弹出警告框的代码
<input onclick="myalert()" type="button" value="点击我,弹出警告框" />
<script type="text/javascript">
function alert(){
alert(hello,我是警告框);
}
</script>
是不是很简单,然后继续吧...
2、在javascript代码中绑定(绑定事件可以使javascript代码与html标签分离,文档结构清晰,便于管理和开发)
<input id="demo" type="button" value="点击我,显示 type 属性" />
<script type="text/javascript">
document.getelementbyid(demo).onclick=function(){
alert(this.getattribute(type)); // this 指当前发生事件的html元素
}
</script>
3、绑定事件监听,绑定事件的另一种方法是用 addeventlistener() 或 attachevent() 来绑定事件监听函数。
①.addeventlistener(eventname,handle,usecapture)。
标准的绑定事件监听函数的方法
eventname 事件名称。注意,这里的事件名称没有“ on ”,如鼠标单击事件 click ,鼠标双击事件 doubleclick ,鼠标移入事件 mouseover,鼠标移出事件 mouseout 等。
handle 事件句柄函数,即用来处理事件的函数。
usecapture boolean类型,是否使用捕获,一般用false 。
②.attachevent(eventname,handle);
elementobject dom对象(即dom元素)。
eventname 事件名称。注意,与addeventlistener()不同,这里的事件名称有“ on ”,如鼠标单击事件 onclick ,鼠标双击事件 ondoubleclick ,鼠标移入事件 onmouseover,鼠标移出事件 onmouseout 等。
handle 事件句柄函数,即用来处理事件的函数。
以上就是javascript事件绑使用方法的详细内容。