我有一个检票口 MultiLineLabel,其内容来自数据库。现在我需要将此 MultiLineLabel 文本显示为页面上悬停时的工具提示。
你能建议我怎么做吗(我是新来的检票口)。我应该使用 jquery 解决方案还是应该在我的页面上添加onmouseover
和?onmouseout
AjaxEventBehaviors
当我尝试jquery 解决方案时,我不知道如何维护工具提示中的换行符。
请向我提供您拥有的任何示例。
我有一个检票口 MultiLineLabel,其内容来自数据库。现在我需要将此 MultiLineLabel 文本显示为页面上悬停时的工具提示。
你能建议我怎么做吗(我是新来的检票口)。我应该使用 jquery 解决方案还是应该在我的页面上添加onmouseover
和?onmouseout
AjaxEventBehaviors
当我尝试jquery 解决方案时,我不知道如何维护工具提示中的换行符。
请向我提供您拥有的任何示例。
我已经使用标准标签对此进行了测试,并且可以正常工作:
Label ml;
String msg = "Hello! \n I'm here.";
add(ml = new Label("multiline",msg));
ml.add(AttributeModifier.append("title", msg));
更新
不幸的是,无法控制使用“标题”属性生成的工具提示的样式,因为它是操作系统原生组件。但是,您可以轻松地修改您在http://www.mkyong.com/jquery/how-to-create-a-tooltips-with-jquery/找到的代码。您可以将工具提示的文本放在自定义属性中,我们称之为“toolTipText”:
String tooltipMsg = Strings.toMultilineMarkup(yourMsgFromDb).toString();
...
yourLabel.add(AttributeModifier.append("toolTipText", tooltipMsg));
请注意,您必须使用 toMultilineMarkup 来维护工具提示中的换行符。现在您应该稍微修改函数 showTooltip 以使用插入到自定义属性中的值:
var showTooltip = function(event) {
$('div.tooltip').remove();
$('<div class="tooltip">' + $(this).attr('toolTipText') +'</div>')
.appendTo('body');
changeTooltipPosition(event);
};
最后,您必须告诉 JQuery 对您的标签使用工具提示。您必须将“span#hint,label#username'”替换为与您的组件匹配的选择器。
我已经测试过了,它似乎工作。