javascript變量範圍跨功能jQuery涉及

Question

這是我無法去工作 - 在mouseMove this.mouseX是未定義的。我需要mousemove事件中的mouseX和mouseY（代碼中的e.pageX）。

function myClass() { 
    var mouseX=x; 
    var mouseY=y; 
    $(document).mousemove(this.mouseMove); 
} 
myClass.prototype.mouseMove = function(e){ 
    this.mouseX=e.pageX;//not a good idea but you can alert this 
} 
var a=new myClass(); 

我可以將該事件傳遞給所謂的類實例，或者無法完成它嗎？

我也應該提到我想避免全局範圍變量在這裏。

Answer 1

兩三件事情：

var mouseX只聲明一個變量本地的myClass的功能。您必須聲明的實例的屬性與this.mouseX（this指當前實例）：

function myClass() { 
    this.mouseX=x; // where do x and y come from? 
    this.mouseY=y; 
    //... 
} 

其次，要確保你通過x和y作爲參數傳遞給構造函數。否則，你會得到一個錯誤（如果它們沒有在更高範圍內定義，但對我來說似乎沒有用處）。

第三，如果你只是通過this.mouseMove作爲事件處理程序，該事件處理中，this將把window，而不是到myClass實例。使用$.proxy明確設置回調的背景下：

function myClass(x, y) { 
    this.mouseX=x; 
    this.mouseY=y; 
    $(document).mousemove($.proxy(this.mouseMove, this)); 
} 

---

我建議閱讀MDC - Working with objects。

Answer 2

當你通過一個像this.mouseMove這樣的方法作爲回調函數時，它不再綁定到實例 - 所以this將是全局對象。要解決的範圍，你可以在一個閉合通過實例，就像這樣：

function myClass (x,y) { 
    var mouseX=x; 
    var mouseY=y; 
    var that = this; 
    $(document).mousemove(function() { that.mouseMove() }); 
} 

Answer 3

嘗試：

function myClass (x,y) { 
    var mouseX=x; 
    var mouseY=y; 
    var $this = this; 

    $(document).mousemove(function(){$this.mouseMove()}); 
} 
myClass.prototype.mouseMove = function(e){ 
    this.mouseX=e.pageX;//not a good idea but you can alert this 
} 
var a=new myClass(); 

Answer 4

function myClass() { 
    this.mouseX=x; 
    this.mouseY=y; 
    $(document).mousemove(this.mouseMove); 
} 
myClass.prototype.mouseMove = function(e){ 
    this.mouseX=e.pageX;//not a good idea but you can alert this 
} 
var a=new myClass(); 

您需要使用這個關鍵字，而不是VAR的實例構造函數