我目前正在为我们的网站添加冗长的工具提示,我想(不必求助于一个神奇的jQuery插件,我知道有很多!)使用回车来格式化工具提示。

为了添加提示,我使用了title属性。我环顾了一下常用的网站,并使用了基本的模板:

<a title='Tool?Tip?On?New?Line'>link with tip</a>

我试过更换?:

< br / > &013;/ & # 13; \ r \ n 环境。换行符(我使用c#)

以上方法都行不通。这可能吗?


当前回答

这很简单:只需按下Enter!

<a href="#" title='工具 提示 在 新 Line'>link with tip</a>

其他回答

在Chrome 16或更早的版本中,你可以使用“\n”。顺便说一句,“\t”也可以。

在IE, Chrome, Safari, Firefox(最新版本2012-11-27)中测试: & # 13;

它们都适用……

试试第10个字符。直到2015年1月,它还不能在Firefox中运行。

文本(如果有的话)显示在 依赖浏览器的方式。小 工具提示适用于大多数浏览器。长 IE中的工具提示和换行 和Safari(使用&#10;或& # 13;对于一个 新换行符)。Firefox和Opera则不然 支持换行。Firefox则没有 支持长工具提示。

http://modp.com/wiki/htmltitletooltips

Firefox现在支持使用&#13;在HTML标题属性中插入换行符。请参阅下面的代码片段示例。

<a href="#" title="第1行&#13;第2行&#13;第3行">悬停多行标题</a>

有多种方法可以做到这一点。&#13或&#010;取决于浏览器。但下面的例子适用于我的谷歌Chrome和Firefox。

<a href="javascript:;" title="工具提示第一行&#10;工具提示第二行&#10;工具提示第三行">工具提示</a> .

“只需按下enter”的解决方案在这里不起作用,所以优秀的老香草JavaScript似乎是一种相当高效和干净的方法。

function customTitle(event, textHeader, text){
    let eventOrigin = event.target || event.srcElement;
    eventOrigin.title = textHeader + '\n\n' + text;
}

在元素onmouseover上:

onmouseover="customTitle(event, 'Some Caput', 'Some more or less complete description');"

瞧!它适用于谷歌Chrome和Firefox(不排除其他;我只是没有检查)。