关闭

JavaScript中绑定事件的几种方式

198人阅读 评论(0) 收藏 举报
分类:

  在JavaScript中绑定事件的方式有以下几种,分别是:1.DOM中绑定事件;2.在JavaScript代码中绑定事件;3.绑定事件监听函数。

1.DOM中绑定事件

1)添加onclick点击事件,自定义load()函数

<input type="submit" value="Login"  onclick="load();">

2)调用load()函数,绑定onclic事件

function load(){
   alert("dom元素中绑定事件");
}

2.JavaScript代码中绑定事件

1)添加id="submit"

<input type="submit" value="Login" id="submit">
2)获取id,添加onclick事件,注意,js要放在input标签下,要不然无法激活onclick事件

document.getElementById("submit").onclick=function(){
   //获取属性
   this.getAttribute("type");
   alert("JavaScript代码中绑定事件");
}

3.绑定事件监听函数

 绑定事件主要用的addEventListener()或attachEvent()来绑定事件监听函数。如下:

1)addEventListener()是标准的绑定事件监听函数方法,是W3C所支持的,但,ie8.0不支持该方法,它支持的是attachEvent()来绑定事件监听函数

语法:

elementObject.addEventListener(eventName,handle,useCapture);

示例:

<input type="button" value="Login" id="submit">

document.getElementById("submit").addEventListener("click",load);
function load(){
  alert("addEventListener监听事件...");
}

2)attachEvent()来绑定事件监听函数方法

语法:

elementObject.attachEvent(eventName,handle);

3)移除监听事件

语法:

elementObject.removeEventListener(eventName,handle,useCapture);
document.getElementById("submit").removeEventListener("click",load);
参考文章:http://www.tuicool.com/articles/JF7bMj3



0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:34854次
    • 积分:1082
    • 等级:
    • 排名:千里之外
    • 原创:76篇
    • 转载:2篇
    • 译文:0篇
    • 评论:0条