Доступ к членским переменным класса в обработчике событий в JavaScript
У меня есть быстрый вопрос относительно надлежащего способа получить доступ к членским переменным класса JavaScript изнутри обработчика событий тот класс использование. Например:
function Map() {
this.x = 0;
this.y = 0;
$("body").mousemove( function(event) {
this.x = event.pageX; // Is not able to access Map's member variable "x"
this.y = event.pageY; // Is not able to access Map's member variable "y"
});
}
Вместо того, чтобы заменять членский класса "Карты", "this.x" в конечном счете, обработчик пытается влиять на "x" членскую переменную элемента, который инициировал событие. Что надлежащий путь состоит в том, чтобы получить доступ к членским переменным класса "Карты" из обработчиков событий?
Любая справка значительно ценилась бы - я был видом царапания моей головы в этом.
С наилучшими пожеланиями, Charlie
2 ответа
Поскольку this изменяется в контексте события (обычно указывает на global ), вам необходимо сохранить ссылку на себя вне события:
function Map() {
this.x = 0;
this.y = 0;
var _self = this;
$("body").mousemove( function(event) {
_self.x = event.pageX; // Is now able to access Map's member variable "x"
_self.y = event.pageY; // Is now able to access Map's member variable "y"
});
}
Решение, которое предложил Matt, вероятно, будет правильным.
Просто подумал, что нужно указать, что вы можете передавать данные через объект события следующим образом:
function Map() {
this.x = 0;
this.y = 0;
// Pass object with data-------------v
$("body").bind('mousemove', {ths: this}, function(event) {
// access this via event.data
event.data.ths.x = event.pageX;
event.data.ths.y = event.pageY;
});
}
Это просто для информации. На самом деле это не имеет практического применения. Ссылка Мэтта на локальную переменную имеет больше смысла.