[英]Add dojo tooltip dialog to each table cell
I'm tyring to add a dojo tooltip dialog to every table cell so that when i hover over each cell the content. 我打算向每个表单元格添加一个dojo工具提示对话框,以便当我将鼠标悬停在每个单元格上时将其内容显示。 I'm using the tooltip dialog because there is clickable content on it. 我正在使用工具提示对话框,因为上面有可单击的内容。
I know this is possible using the tooltip control as below 我知道可以使用如下所示的工具提示控件
require(["dijit/Tooltip", "dojo/query!css2", "dojo/domReady!"], function(Tooltip){
new Tooltip({
connectId: "myTable",
selector: "tr",
getContent: function(matchedNode){
return matchedNode.getAttribute("tooltipText");
}
});
});
I can't find anyway to do similar with the tooltip dialog, any suggestions? 无论如何,我找不到与工具提示对话框类似的内容,有什么建议吗?
dijit/TooltipDialog
looks like a Tooltip
, but it's really a dressed-up dialog. dijit/TooltipDialog
看起来像Tooltip
,但实际上是一个装扮好的对话框。 You'll need to use dijit/popup
manually to do what you want. 您需要手动使用dijit/popup
来完成所需的操作。 Fortunately, there's a great example of this in the documentation . 幸运的是, 在文档中有一个很好的例子 。
I've made a fiddle that takes that demo and tweaks it to your situation with a table. 我做了一个小提琴 ,将它演示并用桌子调整到您的情况。 Making a different tooltip per cell shouldn't be too far of a leap from here, if that's your desire. 如果您愿意的话,为每个单元格创建不同的工具提示应该离这里不远。 You could use dojo/query
to get all the cells and attach a new TooltipDialog
to each one, for instance. 例如,您可以使用dojo/query
获取所有单元格并将新的TooltipDialog
附加到每个单元格。
The relevant parts of that code follow. 该代码的相关部分如下。
Open the dialog when hovering: 悬停时打开对话框:
on(dom.byId('table1'), 'mouseover', function(){
popup.open({
popup: myTooltipDialog,
around: dom.byId('table1')
});
});
Close the dialog when leaving: 离开时关闭对话框:
var myTooltipDialog = new TooltipDialog({
// ...
onMouseLeave: function(){
popup.close(myTooltipDialog);
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.