如何將事件聽者附加到一個對象JS

這似乎可以作爲http://www.knockoutjs.com的傢伙似乎這樣做。我還沒有能夠使他們的代碼庫有足夠的感覺來獲得類似的模式。如何將事件聽者附加到一個對象JS

切實我有一個基於jQuery的選項卡上的UI一個MVVM風格的應用程序。每個選項卡都由一個視圖模型表示，我希望能夠根據模型中的更改驗證並觸發事件。

我創建一個類似的頁面加載以下我的數據的表示：


$(document).ready(function(){ 
    thisTab = new ThisTab(); 
}); 

function ThisTab(){ 
    Load: {Load from my model} 
    Save: {Save/Persist model to the db (via web service call)} 
    Validate: { 
    this.Item1 = function(){Validate item 1, do work, refresh fields, whatever.} 
    } 
}

模型本身是一個複雜的全球性目標，並轉移到DOM（輸入等）即時更新的對象。對其中一些屬性的更改應調用其關聯的驗證項目thisTab.Validate.Item1。我沒有提出修改事件的問題。如果我將該事件監聽器綁定到一個隨機DOM元素，我可以調用我的例程而不會出現問題，並且一切都很好。但是，將事件附加到非相關的DOM對象看起來很奇怪。

所以問題是：我該怎麼做類似thisTab.addEventListner("someEvent")或$(thisTab).bind("someEvent")，其中thisTab不是DOM元素，而是本地對象。試圖做到這一點，我總是會得到一個錯誤，「這種方法不被支持」。

來源

2011-03-17 iivel

將事件附加到標準對象不使用相同的方法;基本上，你會實現自己的三項賽，像這樣：

function ThisTab() 
{ 
    listeners: [], 
    addListener: function(callback) { this.listeners.push(callback); }, 
    load: { // Finds DOM elements and such, and attaches to their events. The callback from the DOM event should be a method on your object }, 
    yourDomEventCallback: function() 
    { 
     for(var j = 0; j < this.listeners.length; j++) 
      this.listeners[j](); 
    } 
}

上面的代碼應該作爲一個起點，因爲我只是拼湊一起，有可能語法錯誤。基本上，你已經把你的對象和映射到你想捕獲的事件上，然後公開方法來附加你將在隱藏的DOM事件發生時調用的回調方法。你不能使用jQuery的DOM事件抽象，因爲這些事件對你的自定義對象沒有意義。

來源

2011-03-17 02:06:10 Tejs

綁定事件到你的正常JS對象，你會爲一個DOM對象做。

$(thisTab).bind("someEvent", function() { 
    // handler's code here 
});

看到這個example。使用這個有一個副作用，即jQuery將添加一個看家標識符作爲對象上的屬性 - 它看起來就像 jQuery1510587397349299863。此屬性命名jQuery<timestamp>被添加到具有事件或與它們相關的數據，並定期對象的所有DOM對象

行爲類似。如果你對被修改的模型對象感到不舒服，那麼使用你自己的回調機制，這應該很容易添加。

來源

2011-03-17 05:41:21 Anurag

由於該事件在DOM中不確實的泡沫就只能捕捉觸發本身的事件。我需要它來監聽另一個對象（或潛在的DOM）的變化。今天的某個時候，我會試着準備一個小提琴。 – iivel 2011-03-17 13:35:36

如何將事件聽者附加到一個對象JS

回答

相關問題