ie與ff下的event事件
更新時(shí)間：2009年09月21日 20:27:29 作者：
event是ie自帶的一個(gè)對(duì)象，而ff中不存在該對(duì)象，只能通過(guò)傳遞參數(shù)的方式來(lái)模擬event，：（
更多的文章可以參考 http://m.fzitv.net/tag/event/1.htm
另外ie中使用srcElement去獲得事件觸發(fā)源，ff下使用target。因此使用這兩個(gè)對(duì)象時(shí)需要做相關(guān)的瀏覽器兼容。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
查看運(yùn)行結(jié)果
綜合上節(jié)attachEvent與addEventListener。
<script type="text/javascript">
<!–
function Click(event){
event = event? event: window.event;
var obj = event.srcElement ? event.srcElement:event.target;
alert("eventObj.tabName:" + obj.tagName);
}
var oBtnNew;
window.onload=function(){
oBtnNew=document.getElementById("btnNew");
if(window.attachEvent){
oBtnNew.attachEvent("onclick",hanlder);
oBtnNew.attachEvent("onmouseover",hanlder);
}else{
oBtnNew.addEventListener("click",hanlder,false);
oBtnNew.addEventListener("mouseover",hanlder,false);
}
/*或者采用下面試
oBtnNew.onclick=hanlder;
oBtnNew.onmouseover=hanlder;*/
}
function hanlder(event){
event=event?event:window.event;
if(event.type=="click")
oBtnNew.innerHTML="發(fā)生了onclick事件";
else if(event.type=="mouseover")
oBtnNew.innerHTML="發(fā)生了onmouseover事件";
}
//–>
</script>
</head>
<body>
<button id="btn" onclick="Click(event)">點(diǎn)擊</button>
<button id="btnNew">添加事件點(diǎn)擊</button>
另外ie中使用srcElement去獲得事件觸發(fā)源，ff下使用target。因此使用這兩個(gè)對(duì)象時(shí)需要做相關(guān)的瀏覽器兼容。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
查看運(yùn)行結(jié)果
綜合上節(jié)attachEvent與addEventListener。
復(fù)制代碼 代碼如下:
<script type="text/javascript">
<!–
function Click(event){
event = event? event: window.event;
var obj = event.srcElement ? event.srcElement:event.target;
alert("eventObj.tabName:" + obj.tagName);
}
var oBtnNew;
window.onload=function(){
oBtnNew=document.getElementById("btnNew");
if(window.attachEvent){
oBtnNew.attachEvent("onclick",hanlder);
oBtnNew.attachEvent("onmouseover",hanlder);
}else{
oBtnNew.addEventListener("click",hanlder,false);
oBtnNew.addEventListener("mouseover",hanlder,false);
}
/*或者采用下面試
oBtnNew.onclick=hanlder;
oBtnNew.onmouseover=hanlder;*/
}
function hanlder(event){
event=event?event:window.event;
if(event.type=="click")
oBtnNew.innerHTML="發(fā)生了onclick事件";
else if(event.type=="mouseover")
oBtnNew.innerHTML="發(fā)生了onmouseover事件";
}
//–>
</script>
</head>
<body>
<button id="btn" onclick="Click(event)">點(diǎn)擊</button>
<button id="btnNew">添加事件點(diǎn)擊</button>
相關(guān)文章
這篇文章主要介紹了JS實(shí)現(xiàn)手寫 forEach算法,結(jié)合實(shí)例形式分析了JS實(shí)現(xiàn)手寫 forEach算法實(shí)現(xiàn)原理與相關(guān)操作技巧,需要的朋友可以參考下2020-04-04
JavaScript find()方法及返回?cái)?shù)據(jù)實(shí)例
這篇文章主要介紹了JavaScript中的find()方法和返回?cái)?shù)據(jù)的內(nèi)存指向,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-04-04
這篇文章主要介紹了一文讓你快速了解JavaScript棧，棧全稱為堆棧，是一種先進(jìn)后出的的數(shù)據(jù)結(jié)構(gòu)，棧中只有兩種基本操作，也就是插入和刪除，也就是入棧和出棧操作，棧只有一端可以進(jìn)行入棧和出棧操作，我們將其稱為棧頂，另一端稱其為棧底2022-07-07
45個(gè)JavaScript編程注意事項(xiàng)、技巧大全
這篇文章主要介紹了45個(gè)JavaScript編程注意事項(xiàng)、技巧大全,在這篇文章里,我將分享一些JavaScript的技巧、秘訣和最佳實(shí)踐,除了少數(shù)幾個(gè)外,不管是瀏覽器的JavaScript引擎,還是服務(wù)器端JavaScript解釋器,均適用,需要的朋友可以參考下2015-02-02
最近在學(xué)習(xí)微信小程序，下面就學(xué)習(xí)的內(nèi)容進(jìn)行總結(jié)，這篇文章主要給大家介紹了關(guān)于微信小程序利用co處理異步流程的方法，文中給出了詳細(xì)的介紹和示例代碼供大家參考學(xué)習(xí)，需要的朋友們下面來(lái)一起看看吧。2017-05-05
JS中setTimeout的巧妙用法前端函數(shù)節(jié)流
這篇文章主要介紹了JS中setTimeout的巧妙用法前端函數(shù)節(jié)流 的相關(guān)資料,需要的朋友可以參考下2016-03-03
JS實(shí)現(xiàn)的顏色實(shí)時(shí)漸變效果完整實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)的顏色實(shí)時(shí)漸變效果,結(jié)合實(shí)例形式分析了JavaScript結(jié)合時(shí)間函數(shù)定時(shí)觸發(fā)動(dòng)態(tài)改變頁(yè)面元素屬性的相關(guān)技巧,需要的朋友可以參考下2016-03-03
使用JS中的exec()方法構(gòu)造正則表達(dá)式驗(yàn)證
這篇文章主要介紹了使用JS中的exec()方法構(gòu)造正則表達(dá)式驗(yàn)證的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08
JavaScript 模擬類機(jī)制及私有變量的方法及思路
這篇文章介紹了JavaScript模擬類機(jī)制及私有變量的方法及思路，有需要的朋友可以參考一下2013-07-07
這篇文章主要為大家介紹了項(xiàng)目中使用Typescript封裝axios的示例過(guò)程詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07