將單個Dojo Tooltip動態分配給多個節點

想象一下，我們有一個帶有節點列表的小部件（例如div）。我們希望在鼠標懸停上顯示Dojo Tooltip。裏面的元素是動態生成的，所以我們必須以編程方式添加工具提示。將單個Dojo Tooltip動態分配給多個節點

該策略是首先在postCreate期間定義Tooltip單個時間，然後將其傳遞給處理函數，該處理函數將動態地將其添加到節點。

postCreate: function() { 
    var _this = this; 
    var fooTooltip = new Tooltip(); 

    this.own(on(this, '.elements-container-item', function(e) { 
    lang.hitch(_this, 'onMouseOverHandler')(this, e, fooTooltip); 
    }); 
}

什麼是動態分配Tooltip mouseover'ed元素的正確方法？

onMouseOverHandler: function(node, e, fooTooltip) { 
    fooTooltip.set('connectId', [node]); // doesn't work 
    fooTooltip.set('label', 'foo label'); // doesn't work as well 
}

來源

2015-04-18 Oleg

我的想法是使用事件代表團。即將MouseOver事件處理程序分配給包含動態列表（div）的列表容器。在事件處理程序中檢查'event.target'以查看列表節點是否已被佔用。如果它是顯示工具提示的正確節點。 – frank

謝謝@frank，這個想法看起來不錯。我想知道.set（'connectId'，[節點]）不起作用，它是動態分配conenctId和標籤的正確方法嗎？ – Oleg

你可以這樣做的工具提示。記住，您需要在您的小部件定義中要求dojo/query。

postCreate: function() { 
    var _this = this; 
    var containerNode = this.domNode; // Assuming that the widget has a domNode 

    var fooTooltip = new Tooltip({ 
    connectId: query('.list-container', containerNode), // Search the Node starting at the containerNode. 
    selector: '.list-container-item', 
    getContent: function(matchedNode) { 
     console.debug('this is a tooltip for ', matchedNode); 
    } 
    }); 

}

來源

2015-04-18 09:13:26 frank

將單個Dojo Tooltip動態分配給多個節點

回答

相關問題