最新消息:文章中包含代码时,请遵守代码高亮规范!

js事件【原创】

JavaScript lili 17浏览 0评论
一.普通事件和事件绑定
两者的区别:
普通事件:
var btn = document.getElementById(“hello”); btn.onclick = function(){ alert(1); } btn.onclick = function(){ alert(2); }
以上只会执行alert(2);
事件绑定:
var btn = document.getElementById(“hello”); btn.addEventListener(“click”,function(){ alert(1); },false); btn.addEventListener(“click”,function(){ alert(2); },false);
以上先执行alert(1),再执行alert(2)。

二.事件委托(一类元素同时需要绑定同一类型事件,把事件委托给他们的父元素)
<div id=”box”> <input type=”button” id=”add” value=”添加” /> <input type=”button” id=”remove” value=”删除” /> <input type=”button” id=”move” value=”移动” /> <input type=”button” id=”select” value=”选择” /> </div>
window.onload = function(){ var oBox = document.getElementById(“box”); oBox.onclick = function (ev) { var ev = ev || window.event; var target = ev.target || ev.srcElement; if(target.nodeName.toLocaleLowerCase() == ‘input’)
{ switch(target.id){ case ‘add’ : alert(‘添加’); break; case ‘remove’ : alert(‘删除’); break; case ‘move’ : alert(‘移动’); break; case ‘select’ : alert(‘选择’); break; } } } }

转载时请注明出处及相应链接,本文永久地址:https://blog.yayuanzi.com/23964.html


pay_weixin
pay_weixin
微信打赏
pay_weixin
支付宝打赏
感谢您对作者lili的打赏,我们会更加努力!    如果您想成为作者,请点我

您必须 登录 才能发表评论!