在Firefox浏览器中HTML标题看起来不同

Question

我使用普通标题在我的网站上显示工具提示。我不想在我的页面上使用任何其他工具提示。我需要一个简单的默认浏览器标题。

但在Firefox浏览器中标题看起来不同。并非在所有情况下，仅在某些情况下。

这是小提琴Title Fiddle

import com.lowagie.text.*;
import com.lowagie.text.pdf.PdfWriter

import javax.swing.text.Document

public static void main(String[] args){
        String[] ITEMS = ["Insurance system", "Agent", "Agency", "Agent Enrollment", "Agent Settings",
        "Appointment", "Continuing Education", "Hierarchy", "Recruiting", "Contract",
        "Message", "Correspondence", "Licensing", "Party"];
    com.lowagie.text.Document document = new com.lowagie.text.Document();
    PdfWriter.getInstance(document,new FileOutputStream("List1.pdf"));
    Font zapfdingbats = new Font();
    Font font = new Font();
    Chunk bullet = new Chunk("\u2022", zapfdingbats);
    document.open();
    Paragraph p = new Paragraph("Items can be split if they don't fit at the end: ", font);
    for (String item: ITEMS) {
        p.add(bullet);
        p.add(new Phrase(" " + item + " ", font));
    }
    document.add(p);
    document.close();

}

$('.ACName').each(function() {
    var $ele = $(this);
    if (this.offsetWidth < this.scrollWidth)
        $ele.attr('title', $ele.text());
});

.myProspectTable{
    width:463px;
    border:1px solid #a3a3a3;
}
.myProspectTable tr td{
    border-left:1px solid #a3a3a3;
    padding:5px;
}
.myProspectTable tr td:nth-child(1) div{
    width:160px;
   white-space: nowrap;
     overflow:hidden;
    text-overflow:ellipsis; 
}

有关详细信息，请参阅下面的图片。

帮我解决这个问题

Answer 1

标题属性尊重空格，但显然浏览器处理它们的方式略有不同。在这种情况下，您希望修剪不需要的尾随和前导空格字符以实现一致的外观。

尝试使用String.prototype.trim

$ele.attr('title', $ele.text().trim());

或$.trim如果您想支持IE8及以下版本：

$ele.attr('title', $.trim($ele.text()));    

演示： http://jsfiddle.net/ajLn421s/1/