2個或多個對象的頁面上的JavaScript設計模式

我需要選擇正確的設計模式。我的頁面有2個從相同的構造函數創建的對象。我有的問題是檢測哪個對象正在獲得點擊事件。2個或多個對象的頁面上的JavaScript設計模式

我對象創建後，這樣做：

$("table tr, table button,.dataTables_paginate a").click(function (e) { 
    **myTableName.buttonPressed($(this));** 

});

和

buttonPressed: function (el) { 
    if (el.is('a') && el.closest('li').hasClass('paginate_button')) { 
     var objName = el.attr('aria-controls'); 
     debugger; 
    } 
    else { 
     var objName = $(el).closest('table').attr('id'); 
    } 

    **this.getName(objName);** 
    tbl = myTableName.tbl; 
    editor = myTableName.editor; 
    //myTableName.acl(myTableName.currentForm); 

},

然後

getName: function (objName) { 
    // search through the global object for a name that resolves to this object 
    for (var name in window) 
     if (window[name] == this) { 
      if (objName) { 
       myTableName = window[objName]; 
       //window.myState[this.myInstanceName] = jQuery.extend({}, this); 
       break; 
      } else { 
       window[name] = this; 
       window[window[name]] = window[name]; 
       myTableName = window[window[name]]; 
       // window.myState[this.myInstanceName] = jQuery.extend({}, this); 
      } 
      break; 
     } 
},

除了這些都是全局，我不下跌，這是正確的方式要做到這一點。

想法？

來源

2016-04-25 Leonel Matias Domingos

你的代碼的問題都不是很清楚。「我的頁面有兩個對象」是什麼意思？如果您試圖確定觸發單擊事件的原因，您有兩種選擇：爲每個選擇器創建單獨的事件處理程序，或檢測哪個選擇器在處理所有點擊的單個事件處理程序內觸發了該事件。另外，什麼是「名稱」？選擇器？「name」屬性的值？ ID或節點類型？如果你能清理你的意圖，這將有很大的幫助。 – lerouche

對不起。創建了2個對象： –

對不起。創建了2個對象：var qTableIdent = new QuadTable（）; qTableIdent.initTable（options）; var qTableDocs = new QuadTable（）; qTableIdent.initTable（選項2）;選項和選項2是廣泛的對象。 'name'是實例名稱，如果點擊位於paginate元素上，該名稱也是容器標識或屬性。 buttonPressed：function（el）{el.is（'a'）&& el.closest（'li'）。hasClass（'paginate_button'））{var_objName = el.attr（'aria-controls'） ; 調試器; } else { var objName = $（el）.closest（'table'）。attr（'id'）; } –

看來你應該使用自定義屬性。自定義屬性允許您將其他相關數據存儲到任何DOM元素。可以使用的一種方法是將DOM與一些JS字節碼相關聯。當你必須向後工作時，這是特別有用的，即找到HTML元素的相關對象。該標準規定，這些屬性必須以data-開頭（雖然從技術上講，您可以使用瀏覽器未使用的任何內容，但不建議這樣做）。這裏有一個例子：

HTML：

<table data-instance-name="name1"> 
    ... 
    <button>Action</button> 
    <a>Another action</a> 
</table> 
<table data-instance-name="name2"> 
    ... 
    <button>Action</button> 
    <a>Another action</a> 
</table>

JS：

$('table button, table a').on('click', function() { 
    var name = $(this).closest('table').attr('data-instance-name'), 
     table = tables[name]; 
});

來源

2016-04-25 12:20:47 lerouche

2個或多個對象的頁面上的JavaScript設計模式

回答

相關問題