[英]Javascript mouse event listener created within a class
我在使用我的類創建鼠標監聽器時遇到問題。 首先我創建類(new mouseEventManager()),然后我調用init()函數,我想設置我的zoomHandler函數。 它必須使用類'variable scale_level才能適當縮放屏幕。 但是我被告知scale_level是NaN(不是數字)。
這是代碼:
function mouseEventManager() {
this.designManager;
this.canvasManager;
this.scale_level;
this.init = function(designManager, canvasManager) {
this.designManager = designManager;
this.canvasManager = canvasManager;
this.scale_level = 1; alert(this.scale_level);
var designManager = this.designManager;
//general mousemove listener
$(document).mousemove(function(e){
designManager.HAND_X = e.pageX;
designManager.HAND_Y = e.pageY;
});
//create scroll wheel listener
if(window.addEventListener) { document.addEventListener('DOMMouseScroll', this.zoomHandler, false); }
document.onmousewheel = this.zoomHandler;
}
this.zoomHandler = function() {
var delta = 0;
if (!event) event = window.event;
// normalize the delta
if (event.wheelDelta) {
// IE and Opera
delta = event.wheelDelta / 60;
} else if (event.detail) {
// W3C
delta = -event.detail / 2;
}
if (delta > 0) {
//scroll wheel up
this.scale_level = this.scale_level * 1.25; alert(this.scale_level);
this.canvasManager.mainLayer.setScale(this.scale_level);
this.canvasManager.mainLayer.draw();
} else if (delta < 0) {
//scroll wheel down
this.scale_level = this.scale_level * 0.8;
this.canvasManager.mainLayer.setScale(this.scale_level);
this.canvasManager.mainLayer.draw();
}
alert(delta);
}
}
它看起來像在zoomHandler中,沒有定義mouseEventManager的內部成員。 所以我認為我在變量范圍或其他相關事情上做錯了。
感謝您的任何幫助。
問題是你的處理程序中的this
不是你在實際調用處理程序時所需要的。
嘗試更改內容如下:
var manager = this;
this.zoomHandler = function() {
// ...
然后在函數中使用this
,而不是使用manager
,對象的“已保存”引用。
if (delta > 0) {
//scroll wheel up
manager.scale_level = this.scale_level * 1.25; alert(manager.scale_level);
manager.canvasManager.mainLayer.setScale(manager.scale_level);
manager.canvasManager.mainLayer.draw();
} else if (delta < 0) {
//scroll wheel down
manager.scale_level = manager.scale_level * 0.8;
manager.canvasManager.mainLayer.setScale(manager.scale_level);
manager.canvasManager.mainLayer.draw();
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.