Значение “этого” в обработчике с помощью addEventListener

Если у Вас есть поджигатель, существует повреждение на всей ошибочной опции на вкладке сценария. Как только сценарий поразил Вашу точку останова, можно посмотреть на окно стека поджигателя:

screenshot

65
задан Brian Tompsett - 汤莱恩 24 August 2019 в 10:02
поделиться

1 ответ

Вам необходимо «привязать» обработчик к вашему экземпляру.

var _this = this;
function onClickBound(e) {
  _this.handleCellClick.call(cell1, e || window.event);
}
if (cell1.addEventListener) {
  cell1.addEventListener("click", onClickBound, false);
}
else if (cell1.attachEvent) {
  cell1.attachEvent("onclick", onClickBound);
}

Обратите внимание, что обработчик событий здесь нормализует объект event (переданный в качестве первого аргумента) и вызывает handleCellClick в правильном контексте (т.е. ссылаясь на элемент, к которому был прикреплен прослушиватель событий).

Также обратите внимание, что здесь нормализация контекста (т.е. установка правильного this в обработчике событий) создает циклическую ссылку между функцией, используемой в качестве обработчика события ( onClickBound ), и объектом элемента ( cell1 ). В некоторых версиях IE (6 и 7) это может и, вероятно, приведет к утечке памяти. По сути, эта утечка связана с тем, что браузер не может освободить память при обновлении страницы из-за циклической ссылки, существующей между собственным и хост-объектом.

Чтобы обойти это, вам нужно будет либо а) удалить эту нормализацию; б) использовать альтернативную (и более сложную) стратегию нормализации; c) «очистить» существующие прослушиватели событий при выгрузке страницы, то есть с помощью removeEventListener , detachEvent и elements null ing (что, к сожалению, будет отображать быструю историю браузеров навигация бесполезна).

Вы также можете найти библиотеку JS, которая позаботится об этом. Большинство из них (например, jQuery, Prototype.js, YUI и т. Д.) Обычно обрабатывают очистку, как описано в (c).

detachEvent и elements null ing (что, к сожалению, сделает быструю навигацию по истории браузеров бесполезной).

Вы также можете найти библиотеку JS, которая позаботится об этом. Большинство из них (например, jQuery, Prototype.js, YUI и т. Д.) Обычно обрабатывают очистку, как описано в (c).

detachEvent и elements null ing (что, к сожалению, сделает быструю навигацию по истории браузеров бесполезной).

Вы также можете найти библиотеку JS, которая позаботится об этом. Большинство из них (например, jQuery, Prototype.js, YUI и т. Д.) Обычно обрабатывают очистку, как описано в (c).

42
ответ дан 24 November 2019 в 15:22
поделиться
Другие вопросы по тегам:

Похожие вопросы: