IE對'this'的理解

在這段代碼中，Firefox將'this'視爲被點擊的元素，並通過正確的方式傳遞href屬性。IE對'this'的理解

IE似乎認爲'this'代替了[object window]。我如何在兩個瀏覽器中以相同的方式使用它？

注：jQuery的將是可愛的，但不是這個項目的選擇

var printElem = getElementsByClassName('print', 'a'); 
for(i in printElem){ 
    ObserveEvent(printElem[i], 'click', function(e){ 
     window.open(this.href, '', 'location=0,menubar=1,resizable=1,scrollbars=1,width='+810+',height='+700); 
     cancelEvent(e); 
    }); 
}

來源

2009-09-23 SeanJA

這個代碼在事件處理程序：用於處理每個元素創建一個封閉的作用域的元素？ – n8wrl 2009-09-23 15:51:31

你的ObserveEvent函數是什麼？ – 2009-09-23 15:51:45

如果是這樣，它必須<1.6。在Prototype中，從1.6開始，Prototype確保你看到的元素是'this'引用的元素（這可能與事件觸發的元素不同，因爲大多數事件都會冒泡 - 非常方便的區分）。 – 2009-09-23 16:03:13

我在這裏添加我的兩分錢，因爲我認爲你可以使用它。

有一個contest 4 years ago看誰能寫出最好的addEvent執行。它試圖解決的主要問題之一是在事件處理程序中保留this。

這裏是one contest entry的jQuery的創建者寫道：

function addEvent(obj, type, fn) { 
    if (obj.attachEvent) { 
    obj['e'+type+fn] = fn; 
    obj[type+fn] = function(){obj['e'+type+fn](window.event);} 
    obj.attachEvent('on'+type, obj[type+fn]); 
    } else 
    obj.addEventListener(type, fn, false); 
}

（當然是對稱的）：

function removeEvent(obj, type, fn) { 
    if (obj.detachEvent) { 
    obj.detachEvent('on'+type, obj[type+fn]); 
    obj[type+fn] = null; 
    } else 
    obj.removeEventListener(type, fn, false); 
}

重命名爲「ObserveEvent」如果你想。

你有它，一個8行的實現，你可以放入你的代碼庫 - 沒有庫，沒有框架。你的處理程序中的引用this工作得很好。

來源

2009-09-24 11:10:46

很酷，謝謝！我仍然很想轉換到一個框架，以增加代碼的一致性。 – SeanJA 2009-09-24 11:16:33

從我+1 :)不是原型取決於方法，但？即修補安全嗎？ – 2009-09-24 12:34:13

@亞歷山大：非常親切的你:)我想我知道你的意思。我不願意修補原型庫，不。然而，當我讀到這個問題時，我認爲他們只是從原型的內部剝離了代碼，在這種情況下，他們可以將自己的代碼修補到他們心中的內容。 – 2009-09-24 12:49:30

可以使用event target，就像這樣：

ObserveEvent(printElem[i], 'click', function(e){ 
      var target = e.target || e.srcElement; 
      window.open(target.href, '', 'location=0,menubar=1,resizable=1,scrollbars=1,width='+810+',height='+700); 
      cancelEvent(e); 
    });

來源

2009-09-23 15:51:58

該死的......我大部分都是在那裏，我有e.target，我錯過了e.srcElement部分。謝謝 – SeanJA 2009-09-23 16:02:18

提醒我們jQuery之前的日子，heh – 2009-09-23 16:04:45

如果'printElem [i]'包含子元素並且其中一個*被點擊，這將失敗。 – 2009-09-23 16:15:57

問題從ObserveEvent幾乎肯定莖函數使用IE的attachEvent方法，該方法（與其他瀏覽器中的addEventListener不同）不會將this設置爲事件處理程序中正在觀察的對象。

來源

2009-09-23 16:34:18

另一種選擇：

var printElem = getElementsByClassName('print', 'a'); 
for(var i in printElem){ 
    (function(elem) { // elem === printElem[i] at time of execution later 
    ObserveEvent(elem, 'click', function(e){ 
     window.open(elem.href, '', 'location=0,menubar=1,resizable=1,scrollbars=1,width='+810+',height='+700); 
     cancelEvent(e); 
    }); 
    })(printElem[i]); // immediately call the temp function with our element 
}

來源

2009-09-24 12:35:32 gnarf

IE對'this'的理解

回答

相關問題