通過原生JS實(shí)現(xiàn)為元素添加事件的方法
更新時(shí)間：2016年11月23日 10:50:55 投稿：jingxian
下面小編就為大家?guī)硪黄ㄟ^原生JS實(shí)現(xiàn)為元素添加事件的方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
自己寫了一個(gè)為元素添加事件的方法，并封裝到對(duì)象中。
說明：
id : 目標(biāo)元素的ID
type: 事件的類型，注意的是不能加on
fn:事件處理程序
isBubble :規(guī)定事件流
代碼：
var bindEvent = {
'add':function(id,type,fn,isBubble){
var dom = document.getElementById(id);
if(!isBubble) isBubble=false;
if(dom.addEventListenner){
dom.addEventListenner(type,fn,isBubble);
}else if(dom.attachEvent){
Transit = function(){
fn.call(dom);
}
dom.attachEvent('on'+type,Transit);
}else{
dom['on'+type] = fn;
}
},
'remove':function(id,type,fn,isBubble){
var dom = document.getElementById(id);
if(!isBubble) isBubble=false;
if(dom.removeEventListenner){
dom.removeEventListenner(type,fn,isBubble)
}else if(dom.detachEvent){
dom.detachEvent('on'+type,Transit)
}else{
dom['on'+type]=null;
}
}
}
調(diào)用方法：
//定義事件處理程序
function msg(){
alert(this.tagName)
}
//為目標(biāo)元素綁定事件
bindEvent.add('link','click',msg,false);
//解除目標(biāo)元素綁定的事件
bindEvent.remove('link','click',msg,false);
以上這篇通過原生JS實(shí)現(xiàn)為元素添加事件的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
layui實(shí)現(xiàn)給某一列加點(diǎn)擊事件
今天小編就為大家分享一篇layui實(shí)現(xiàn)給某一列加點(diǎn)擊事件，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-10-10
layui 實(shí)現(xiàn)二級(jí)彈窗彈出之后 關(guān)閉一級(jí)彈窗的方法
今天小編就為大家分享一篇layui 實(shí)現(xiàn)二級(jí)彈窗彈出之后 關(guān)閉一級(jí)彈窗的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09
詳解Javascript百度地圖接口開發(fā)文檔中的類和方法
最近在工作中在用laravel框架仿寫?zhàn)I了么外賣商城,于是學(xué)習(xí)了一下有關(guān)地圖接口相關(guān)的知識(shí),以下是百步地圖接口開發(fā)文檔的一些類和方法的使用，需要的朋友們可以參考借鑒，下面來一起看看吧。2017-02-02
這篇文章主要為大家詳細(xì)介紹了微信小程序之電影影評(píng)小程序制作代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-08-08
學(xué)習(xí)JavaScript設(shè)計(jì)模式之狀態(tài)模式
這篇文章主要為大家介紹了JavaScript設(shè)計(jì)模式中的狀態(tài)模式，對(duì)JavaScript設(shè)計(jì)模式感興趣的小伙伴們可以參考一下2016-01-01
jquery 實(shí)現(xiàn)上下滾動(dòng)效果示例代碼
上下滾動(dòng)的效果，不用說，大家都有看到過，本文為大家介紹下使用jquery實(shí)現(xiàn)上下滾動(dòng)效果，感興趣的朋友可以參考下，希望對(duì)大家有所幫助2013-08-08
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)select下拉框，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
window.location和document.location的區(qū)別分析
用戶不能改變document.location(因?yàn)檫@是當(dāng)前顯示文檔的位置)。但是,可以改變window.location (用其它文檔取代當(dāng)前文檔)window.location本身也是一個(gè)對(duì)象,而document.location不是對(duì)象2008-12-12
下面對(duì)iframe的所有操作都是在同一個(gè)域下進(jìn)行，暫不考慮跨域調(diào)用2009-10-10
這篇文章主要介紹了js實(shí)現(xiàn)加載更多功能的方法,以實(shí)例演示了加載更多的代碼實(shí)現(xiàn),非常具有實(shí)用價(jià)值,需要的朋友可以參考下2016-10-10