jQuery與oop事件函數調用？

var objs = new Array(); 

function Foo(a) { 
    this.a = a 
    $("#test").append($("<button></button>").html("click").click(this.bar)); 
} 

Foo.prototype.bar = function() { 
    alert(this.a); 
} 

$(document).ready(function() { 
    for (var i = 0; i < 5; i++) { 
     objs.push(new Foo(i)); 
    } 
});

是有可能讓這個一個按鈕被點擊時，jQuery與oop事件函數調用？

它返回對應Foo.a值（從創建按鈕富OBJ）？

來源

2010-06-04 andrew

請訪問http://stackoverflow.com/faq歡迎SO ... – Reigel 2010-06-04 01:35:01

的@Khnle的答案是接近的，但這種做法需要一個匿名函數使用self參考：

function Foo(a) { 
    this.a = a; 
    var self = this; 
    $("#test").append($("<button></button>").html("click").click(function() { 
    self.bar(); // correct `this` value inside `bar` 
    })); 
}

你也可以使用$.proxy方法，以保存對象上下文：

function Foo(a) { 
    this.a = a 
    $("#test").append($("<button></button>") 
      .html("click") 
      .click($.proxy(this.bar, this))); 
}

檢查上面的例子here。

來源

2010-06-04 01:38:37 CMS

在你的點擊處理程序中，這不再指向Foo對象，而是發生點擊的元素，這是本例中的按鈕元素。因此，要解決這個問題的一種方法是如下：

function Foo(a) { 
    this.a = a; 
    var self = this; 
    $("#test").append($("<button></button>").html("click").click(self.bar)); 
}

來源

2010-06-04 01:30:15

嘗試，但不工作..在Foo.bar中的alert（）只會給我「未定義」，它應該顯示Foo.a按鈕的創建者的數量obj – andrew 2010-06-04 01:38:02

它不起作用，因爲'$ .click'方法只接收對'self.bar'函數作爲參數，並且將使用'this'值指向元素來執行那觸發了事件。 – CMS 2010-06-04 01:40:18

這裏有更多的jQuery的風格（沒有全局OBJ文件或FOOS）

(function ($) { 

     $.fn.aghragbumgh = function (settings) { 
      var config = { 'a': 0 }; 

      if (settings) $.extend(config, settings); 

      var bar = function() { 
       alert(config.a); 
      } 

      this.each(function() { 
       $(this).append($("<button></button>").html("click").click(bar)); 
      }); 

      return this; 

     }; 

    })(jQuery); 

    $(document).ready(function() { 
     for (var i = 0; i < 5; i++) { 
      $('#test').aghragbumgh({ 'a': i }); 
     }; 
    });

HTML：

<div id="test"></div>

來源

2010-06-04 01:55:19 Luc

jQuery與oop事件函數調用？

回答

相關問題