在popup窗口中俘获事件的缺陷修复
生活随笔
收集整理的這篇文章主要介紹了
在popup窗口中俘获事件的缺陷修复
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
我們在處理HTML元素的事件時,通??梢允褂脙煞N方法來添加其處理函數。一是直接向HTML元素的事件處理回調(如:onclick、onlond等)賦值;一是使用元素的attachEvent()方法來添加處理函數。這兩種方法對于普通的頁面表現出來的效果是完全相同的,而對于popup它們卻有很大的差別。
????先看下面的popup中事件處理示例,再來說是什么問題: <script?language="javascript">
functionNormalEventListener(elmt)
{
????alert(event);
}
functionAttachEventListener(evt)
{
????alert(evt);
}
varpopwin?=window.createPopup();
varpopdoc?=popwin.document;
vardiv?=popdoc.createElement('DIV');
div.style.width?='100%';
div.style.height?='100%';
div.style.border?='dotted?1px?blue';
div.innerText?='click?me.';
div.onclick?=functionClick()
{
????NormalEventListener(this);
};
div.attachEvent('onclick',?AttachEventListener);
popwin.document.body.appendChild(div);
popwin.show(100,?100,?200,?200);
</script>
????這個示例中,分別使用了兩種方法來添加事件處理函數。對于attachEvent這種方式,我在'使用Popup窗口創建無限級Web頁菜單(3)'一文中介紹過它的用法,而且說明了怎么在其處理函數中獲取全局事件變量event。就是被attach的處理函數的第一個參數即是默認的event變量。
????今天我無意中使用了另一種方法,向事件處理回調賦值的方法附加事件處理函數,div.onclick = function()。卻發現了一個popup窗口中響應時間處理函數的缺陷。執行上面的代碼,我們會發現NormalEventListener()方法的elmt參數是引發事件的元素本身的引用,而此時調用event屬性,卻發現event這廝居然是:null。這可咋怎吶?!?
??? 原來NoramlEventListener()中的event是window.event,因為這個函數定義在IE的window的作用域內,它的引用也可以寫成window.NormalEventListener(),而我們觸發的事件是在popup窗口中的window中。就是說IE的window和popwin.document.parentWindow是兩個不同的域,當然這個時候window.event就是null了。解決這個問題的辦法有兩個,一可以去取popwin.document.parentWindow的event,不過這個方法比較麻煩,需要專門去記錄那個popwin變量。另外還有一個最簡單的方法可以取到正確的event屬性。因為每個事件觸發的源元素(srcElement)和觸發它的事件屬性總是在同一個域中,所以我們就可以使用如下辦法將其取到: ?function?NormalEventListener(elmt)
?{
????var?evt?=?elmt.document.parentWindow.event;
????alert(evt);
?}
????先看下面的popup中事件處理示例,再來說是什么問題: <script?language="javascript">
functionNormalEventListener(elmt)
{
????alert(event);
}
functionAttachEventListener(evt)
{
????alert(evt);
}
varpopwin?=window.createPopup();
varpopdoc?=popwin.document;
vardiv?=popdoc.createElement('DIV');
div.style.width?='100%';
div.style.height?='100%';
div.style.border?='dotted?1px?blue';
div.innerText?='click?me.';
div.onclick?=functionClick()
{
????NormalEventListener(this);
};
div.attachEvent('onclick',?AttachEventListener);
popwin.document.body.appendChild(div);
popwin.show(100,?100,?200,?200);
</script>
????這個示例中,分別使用了兩種方法來添加事件處理函數。對于attachEvent這種方式,我在'使用Popup窗口創建無限級Web頁菜單(3)'一文中介紹過它的用法,而且說明了怎么在其處理函數中獲取全局事件變量event。就是被attach的處理函數的第一個參數即是默認的event變量。
????今天我無意中使用了另一種方法,向事件處理回調賦值的方法附加事件處理函數,div.onclick = function()。卻發現了一個popup窗口中響應時間處理函數的缺陷。執行上面的代碼,我們會發現NormalEventListener()方法的elmt參數是引發事件的元素本身的引用,而此時調用event屬性,卻發現event這廝居然是:null。這可咋怎吶?!?
??? 原來NoramlEventListener()中的event是window.event,因為這個函數定義在IE的window的作用域內,它的引用也可以寫成window.NormalEventListener(),而我們觸發的事件是在popup窗口中的window中。就是說IE的window和popwin.document.parentWindow是兩個不同的域,當然這個時候window.event就是null了。解決這個問題的辦法有兩個,一可以去取popwin.document.parentWindow的event,不過這個方法比較麻煩,需要專門去記錄那個popwin變量。另外還有一個最簡單的方法可以取到正確的event屬性。因為每個事件觸發的源元素(srcElement)和觸發它的事件屬性總是在同一個域中,所以我們就可以使用如下辦法將其取到: ?function?NormalEventListener(elmt)
?{
????var?evt?=?elmt.document.parentWindow.event;
????alert(evt);
?}
??? 這個elmt參數是從Click函數中傳遞過來的觸發事件的元素本身,即:event.srcElement。
本文轉自博客園鳥食軒的博客,原文鏈接:http://www.cnblogs.com/birdshome/,如需轉載請自行聯系原博主。
總結
以上是生活随笔為你收集整理的在popup窗口中俘获事件的缺陷修复的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: tf.truncated_normal和
- 下一篇: 记一次坑爹的 “跨域” 问题