3

我有一个检票口 MultiLineLabel,其内容来自数据库。现在我需要将此 MultiLineLabel 文本显示为页面上悬停时的工具提示。

你能建议我怎么做吗(我是新来的检票口)。我应该使用 jquery 解决方案还是应该在我的页面上添加onmouseover和?onmouseout AjaxEventBehaviors

当我尝试jquery 解决方案时,我不知道如何维护工具提示中的换行符。

请向我提供您拥有的任何示例。

4

1 回答 1

3

我已经使用标准标签对此进行了测试,并且可以正常工作:

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'”替换为与您的组件匹配的选择器。

我已经测试过了,它似乎工作。

于 2012-09-03T14:51:20.127 回答