Cách truy cập thuộc tính đối tượng bên trong hàm sự kiện jQuery

Question

Xin lỗi vì tiếng anh của tôi. Dưới đây là ví dụ mã:

/** 
* @constructor 
*/ 
function MyNewClass(){ 
    this.$my_new_button = $('<button>Button</button>'); 
    this.my_value = 5; 

    this.init = function(){ 
    $('body').append(this.$my_new_button); 
    this.$my_new_button.click(
     function(){ 
     // Its always alerts "undefined" 
     alert(this.my_value); 
     } 
    ) 
    } 
} 

Làm cách nào để truy cập các đối tượng my_value thuộc tính bên trong chức năng sự kiện nhấp chuột của jQuery? Có thể không?

Answer 1

Bạn có thể làm như sau

function MyNewClass(){ 
    this.$my_new_button = $('<button>Button</button>'); 
    this.my_value = 5; 
    var self = this; //add in a reference to this 
    this.init = function(){ 
     $('body').append(this.$my_new_button); 
     this.$my_new_button.click(
      function(){ 
       //This will now alert 5. 
       alert(self.my_value); 
      } 
     ); 
    }; 
} 

Đây là một mô hình nhỏ trong javascript (mặc dù tên eludes tôi). Nó cho phép bạn truy cập các thành viên cấp cao nhất của một hàm trong một hàm bên trong. Trong một hàm lồng nhau, bạn không thể sử dụng "this" để chỉ các thành viên cấp cao nhất vì nó sẽ chỉ đề cập đến hàm bạn đang ở trong đó. do đó cần phải khai báo các hàm mức cao nhất "giá trị" này vào biến riêng của nó (được gọi là tự trong trường hợp này).

Answer 2

Jquery có một phương pháp cho rằng, jQuery.proxy(function, context):

function MyNewClass(){ 
    this.$my_new_button = $('<button>Button</button>'); 
    this.my_value = 5; 

    this.init = function(){ 
    $('body').append(this.$my_new_button); 
    this.$my_new_button.click(
     $.proxy(function(){ 
     // Its always alerts "undefined" 
     alert(this.my_value); 
     },this) 
    ) 
    } 
} 

DEMO