动态的绑定事件addEventListener方法的使用

代码如下:

<script language = "javascript" type = "text/javascript">
function test(){
window.alert("你投了一次票");
//解除绑定事件
document.getElementById("but1").removeEventListener("onclick",test);
}
</script>
<body>
<input id = "but1" type = "button" value = "投票" />
<script language = "javascript" type = "text/javascript">
//动态绑定事件 可以取消绑定
document.getElementById("but1").addEventListener("onclick",test);
</script>
</body>

赞 (0)

相关推荐

  • window.addEventListener来解决让一个js事件执行多个函数

    可能你也碰到过这种情况,就是在js的代码中用了window.onload后,可能会影响到body中的onload事件.你可以全写在body中,也可以全放到window.onload中,但是这样并不是很方便,有时我们需要两个同时用到.这时就要用window.attachEvent和window.addEventListener来解决一下. 下面是一个解决方法.至于attachEvent和addEventListener的用法,可以自己Google或百度一下. 复制代码 代码如下: if (docu

  • 事件绑定之小测试 onclick && addEventListener

    事件绑定之小测试 onclick && addEventListener

    开发工具中应该有相应的功能,于是测试之: 前提:只是一个简单的小测试,而且 addEventListener 属于标准绑定函数,IE 中与此不兼容(IE 相应的是 attachEvent),所以此次测试先抛弃 IE,使用 Firefox 5.0.1, Chrome 14.0, Opera 11.50 测试页面: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <title>Test</title> <sty

  • addEventListener和attachEvent二者绑定的执行函数中的this不相同

    写 addEventListener 和 attachEvent 区别的博文不少,不过大部分都把重点放置于前者是Firefox chrome,后者只是存在于IE系列中. 最近在写一个事件代理的时候,遇到一个BUG,发现除此外,二者绑定的执行函数中的 this 是不相同的,addEventListener 和 attachEvent函数在运行时候的上下文是不相同的. 用了一个简单的demo来描述这个不同点: 复制代码 代码如下: <html xmlns="http://www.w3.org/

  • 详解addEventListener的三个参数之useCapture

    addEventListener 有三个参数:第一个参数表示事件名称(不含 on,如 "click"):第二个参数表示要接收事件处理的函数:第三个参数为 useCapture,本文就讲解它. 复制代码 代码如下: <div id="outDiv">   <div id="middleDiv">     <div id="inDiv">请在此点击鼠标.</div>   </d

  • 讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别

    第一件事情. this 指钟是JavaScript语言中的一个特殊指钟,他在代码运行时,指向调用this语句的当前对象. 如果是事件绑定函数,则指向被绑定的元素本身. <script type="text/javascript"> //by Go_Rush(阿舜) from  http://ashun.cnblogs.com/ alert(this===window)  //true  直 接调用的时候,指向window本身 var gorush={     f:funct

  • javascript attachEvent和addEventListener使用方法

    attachEvent方法 按钮onclick addEventListener方法 按钮click 两者使用的原理:可对执行的优先级不一样,下面实例讲解如下: attachEvent方法,为某一事件附加其它的处理事件.(不支持Mozilla系列) addEventListener方法 用于 Mozilla系列 举例: Java代码 复制代码 代码如下: document.getElementById("btn").onclick = method1; document.getElem

  • addEventListener 的用法示例介绍

    (要注意的是div必须放到js前面才行) 一般情况下,如果给一个dom对象绑定同一个事件,只有最后一个会生效,比如: 复制代码 代码如下: document.getElementById("btn").onclick = method1; document.getElementById("btn").onclick = method2; document.getElementById("btn").onclick = method3; 那么将只有

  • document.addEventListener使用介绍

    document.addEventListener("事件名称", 函数, false); 复制代码 代码如下: function 某函数(event){ // 方法执行 } addEventListener里最后一个参数决定该事件的响应顺序: 如果为true事件执行顺序为 addEventListener ---- 标签的onclick事件 ---- document.onclick 如果为false事件的顺序为 标签的onclick事件 ---- document.onclick

  • Javascript 的addEventListener()及attachEvent()区别分析

    Mozilla中: addEventListener的使用方式: target.addEventListener(type, listener, useCapture); target: 文档节点.document.window 或 XMLHttpRequest. type: 字符串,事件名称,不含"on",比如"click"."mouseover"."keydown"等. listener :实现了 EventListene

  • addEventListener()第三个参数useCapture (Boolean)详细解析

    举例 <div id="div1">  <div id="div2">    <div id="div3">      <div id="div4">      </div>    </div>  </div></div> 如果在 d3 上点击鼠标,事件流是这样的: 捕获阶段 在 div1 处检测是否有 useCapture 为 t

  • JS在IE和FF下attachEvent,addEventListener学习笔记

    对象名.addEventListener("事件名(不带ON)",函数名,true/false);(FF下) 对象名.attachEvent("事件名",函数名);(IE下) 说明: 事件名称,要注意的是"onclick"要改为"click","onblur"要改为"blur",也就是说事件名不要带"on". 函数名,记住不要跟括号最后一个参数是个布尔值,表示该事件的

随机推荐