如何更新addEventListener?

时间:2012-05-17 15:23:17

标签: javascript javascript-events addeventlistener

我要更新我的代码以使用addEventListener()而不是只是在javascript中写入element属性。

在我这样做之前,我想验证一些事情。

1。)我假设我不必调用removeEventListener(),如果我更新DOM并删除元素(通过.innerHTML写)。

2。)流行的现代浏览器支持addEventListener - IE9,Chrome,Firefox,Safari

3.)现代浏览器中没有其他问题可以出现。

我问b.c.我不想在更新我的代码时跳过枪。

备注:

属性到事件关联(删除打开)。

  • onkeypress - keypress
  • onblur - >模糊
  • onfocus - >集中

研究

https://developer.mozilla.org/en/DOM/element.addEventListener(兼容性图表)

http://www.quirksmode.org/js/events_advanced.html

相关

JavaScript listener, "keypress" doesn't detect backspace?

备注

  • 而不是返回false。使用preventDefault()可以阻止表单在输入时提交。

2 个答案:

答案 0 :(得分:4)

1)你不需要为此调用removeEventListener但你需要调用removeEventListener 如果你通过addEventListener删除附加到eventListener的DOM元素,如果删除它的任何子元素你不需要删除任何东西。

2)所有主流浏览器都支持addEventListener

3)与addEventListener相关的现代浏览器没有其他问题

4)onkeypress不是事件的名称,而是属性,事件名称是按键。与* alike

上的其他名称相同

避免jQuery实现跨浏览器兼容性的快速代码:

Element.prototype.on = function(evt, fn) {
if (this.addEventListener)
    this.addEventListener(evt, fn, false);
else if (this.attachEvent)
    this.attachEvent('on' + evt, fn);
};

Element.prototype.off = function(evt, fn) {
    if (this.removeEventListener)
        this.removeEventListener(evt, fn, false);
    else if (this.detachEvent)
        this.detachEvent('on' + evt, fn);
};

答案 1 :(得分:3)

  1. 你不必。如果您不存储对DOM元素的引用(例如,在意外的全局变量中),垃圾收集器应该清理它。

  2. 这是浏览器的支持。对于较旧的IE,attachEvent() 几乎相同。

  3. 你不应该担心什么。这是现代化的方式。

  4. 注意:您可能希望使用jQuery来跨浏览器制作内容。如果可能的话,它会使用addEventListener,对于较旧的IE和normalizes your event object,它可以回退到attachEvent,因此您不必担心差异。它对DOM操作和遍历也很有用。