使用javascript / jquery在title属性中插入换行符

时间:2011-09-24 20:12:17

标签: javascript jquery tooltip

问题:
我需要在我的工具提示中放置一个换行符,所以它不是全部都在一行上。我使用tooltipsy生成工具提示。它的工作原理是在任何锚标签上使用title属性,并将“hastipy”作为工具提示的内容。

所以代码:

<a href="http://tooltipsy.com/" class="hastipy" title="Click here to go to the tooltipsy website">
     tooltipsy
</a>

将显示文字“工具提示”的链接,当您将鼠标悬停在其上时,它会在工具提示中显示“点击此处转到工具提示网站”。

但是,如果我想在工具提示中加入换行符怎么办?

此代码:

<a href="http://tooltipsy.com/" class="hastipy" title="Click here to <br /> go to the tooltipsy website">
     tooltipsy
</a>
http://validator.w3.org

验证错误时,

会返回一堆错误

所以我想出了这个javascript / jQuery(由Jason Gennaro编写):

$('a').each(function(){
    var a = $(this).attr('title');
    var b = a.replace('lineBreak','\n');
    $(this).attr('title', b);
});

此代码使用关键字(在本例中为lineBreak)并将其替换为\n(&lt; - linebreak?),以便我的代码通过验证并且仍然包含换行符。

这段代码可以在jsfiddle(here is the example)上运行,但是在我的工具提示内的网站上却没有。它会插入\n,但它不会像预期的那样删除“lineBreak”。

任何人都可以为此提供解释,甚至是可能的解决方法吗?

注意:
我不想要另一个工具提示方法的建议,工具提示完全适用于我需要的一切。

结果:
事实证明,仅使用&lt;br /&gt;代替<br />效果非常好。

1 个答案:

答案 0 :(得分:4)

使用全局替换电话:.replace(/lineBreak/g,'\n');

如果您想在标题属性中添加<br />,请使用:&lt;br /&gt;(html实体)。

此外,JQuery会自动将JavaScript包装在$(document).ready(...)中。你应该这样做:

$(document).ready(function(){
    //HTML-modifying code here.
});