Question

这是我的工作代码： http://jsfiddle.net/gvot4n1e/1/

基本上，我想在鼠标移过某个地方时显示一个工具提示 - 这有效，但不起作用的是我不能将它分成多行（它只显示在一行上）

我甚至尝试过（搜索后）使用此处的解决方案： newline in <td title="">

但它不起作用：（

如果您不想访问jsfiddle顶部的工作代码，请输入以下代码：

$(document).ready(function() {
// Tooltip only Text
$('.masterTooltip').hover(function(){
        // Hover over code
        var title = $(this).attr('title');


         //title = str.replace("PPPPP", "\n");


        $(this).data('tipText', title).removeAttr('title');
        $('<p class="tooltip"></p>')
        .text(title)
        .appendTo('body')
        .fadeIn('1200');
}, function() {
        // Hover out code
        $(this).attr('title', $(this).data('tipText'));
        $('.tooltip').remove();
}).mousemove(function(e) {
        var mousex = e.pageX + 15; //Get X coordinates
        var mousey = e.pageY + -30; //Get Y coordinates
        $('.tooltip')
        .css({ top: mousey, left: mousex })
});
});

Answer 1

将样式white-space: pre-line;添加到工具提示类

更新了小提琴http://jsfiddle.net/s2dthLs5/

jquery - 标题工具提示中的换行符

1 个答案: