將偵聽器委派給XTemplate中的ID的快速幫助（ExtJS）

噢！這是如此艱難...將偵聽器委派給XTemplate中的ID的快速幫助（ExtJS）

需要任何幫助，我們可以在這裏找到有關聽衆+ XTemplate。

我們的目標：將一個'itemtap'監聽器委託給XTemplate中的ID（即div id =「xplay」）。收到

錯誤：

Error in event handler for 'undefined': INDEX_SIZE_ERR: DOM Exception 1 undefined event_bindings:207 
chrome.Event.dispatch event_bindings:207 
chromeHidden.Port.dispatchOnMessage miscellaneous_bindings:250

這裏是我們的XTemplate：

var itemTpl = new Ext.XTemplate(
    '<tpl for=".">', 
     '<img src="http://www.myShortenedUrl.com/{taskImgPath}" />', 
     '<img src="http://www.myShortenedUrl.com/{timeImgPath}" />', 
     '<div id="xplay">', 
      '<img src="http://www.starrbc.org/play_button.jpg" />', 
     '</div>', 
    '</tpl>' 
);

這裏是我們的xtype：列表與綁定到它的XTemplate（ itemTpl）..和被授權爲「xplay」的itemtap監聽器

xtype: 'panel', 
items: [{ 
    xtype: 'list', 
    id: 'bookmarkView', 
    store: bookmarkStore, 
    itemTpl: itemTpl, // setting the XTemplate here 
    listeners: { 
     itemtap: function(bookmarkView, index, item, e){ 
      console.log("Hello I am Here!"); 
     }, 
     element: 'innerElement', 
     delegate: 'xplay' 
    }

我們曾嘗試：

我們刪除element: 'innerElement'和delegate: 'xplay'，它會觸發itemtap功能，當我們點擊XTemplate的任何部位，但不是我們的目標。我們只想要我們的PLAY按鈕來觸發這個監聽器。

任何幫助將非常感謝！

UPDATE

感謝埃文的快速反應。

以下是我對您的輸入所嘗試的內容 - 如果我錯誤地執行操作，請告訴我。

將div id更改爲div class。

var itemTpl = new Ext.XTemplate(
    '<tpl for=".">', 
     '<img src="http://www.myShortenedUrl.com/{taskImgPath}" />', 
     '<div class="xplay">', 
      '<img src="http://src.sencha.io/200/http://www.starrbc.org/play_button.jpg" />', 
     '</div><br/>', 
    '</tpl>' 
);

我增加了對事件對象的檢查，評論代碼離開元素和委託（讓這些有將無法正常工作）。

listeners: { 
    itemtap: function(bookmarkView, index, item, e) { 
       console.log("Hello I am Here!"); 

       if (e.getTarget().hasCls('xplay')) { 
        console.log('hasCls: xplay'); 
       } 
      } //, 
    // element: 'innerElement', 
    // delegate: 'xplay' 
}

然而，我們遇到了這個問題：

Uncaught TypeError: Object [object Object] has no method 'getTarget' Error in event handler for 'undefined': INDEX_SIZE_ERR: DOM Exception 1 undefined

我們很困惑，這是否意味着我們沒有得到一個Event對象？或者我們是否錯誤地解釋了你的解釋？

來源

2012-07-07 user1508876

你正在以錯誤的方式前進。

1）ID應該是唯一的，你不能一遍又一遍地重複id，每個元素必須有一個。相反，給該元素一個類名稱。

2）聽itemtap事件，你一直在做，然後檢查事件對象，看它是否您的代理匹配：

if (e.getTarget().hasCls('myCustomCls')) { 
    // do something 
}

來源

2012-07-08 10:21:37

listeners: { 
    element: 'element',//i hope element works. 
    delegate: 'div.xplay', 
    event:'tap', 
    fn: 'Your function here', 
}

這是聽衆應該如何爲您的要求。

來源

2012-11-16 13:13:02 surendran

將偵聽器委派給XTemplate中的ID的快速幫助（ExtJS）

回答

相關問題