Firefox 中的标题属性

Question

如果在 Firefox 中查看，特定 HTML 元素的 title 属性不会显示在我的应用程序中。有多个主题可以解释这个问题。我无法找到适合我需要的解决方案。所以我问你是否可以帮忙。

我排列了许多 div。在鼠标悬停时，每个 div 应该显示不同的值（标题）。 title 属性在 Chrome 中可以正常工作，但我需要 Firefox 类似的东西。

title 属性是通过 Javascript 动态设置的！

我的 Javascript：

dojo.connect(div, 'mousemove',rasterTimeDisplay);

function rasterTimeDisplay() {
dojo.attr(evt.target, 'title', "some new title");
 }

Answer 1

为什么不将要显示的数据存储在另一个属性中？因为您使用 javascript 来提供数据存储属性，所以您可以随心所欲。

例如，使用 jQuery：

//I feed my data-storage attribute
$("#my_div").attr('my-data', '<h1>my content to be displayed</h1>');
//And then i bind the hover event to toggle displaying of this data
$("#my_div").hover(
    function(){
        $(this).html($(this).attr('my-data'));
    },
    function(){
        $(this).html('');
    }
);

或使用标准 JavaScript：

document.getElementById('my_div').my_data = '<h1>my content to be displayed</h1>';
document.getElementById('my_div').onmouseover = function(){
    this.innerHTML = this.my_data;
};
document.getElementById('my_div').onmouseoout = function(){
    this.innerHTML = '';
};

Answer 2

对不起，如果我误会了你。但是，您是否尝试在悬停时触发 title 属性？但是title属性已经被默认悬停触发：

因此，如果您只是将属性添加到所需的元素，您将获得关于悬停的额外信息。

var titles = document.getElementsByClassName('title');

for(var i = 0; i < titles.length; i++)
{
    titles[i].title = 'Hover information ' + i;
}

jsFiddle

我对 jQuery 的方式很感兴趣：

$('.title').attr('title', 'Hover information');

还是不行？

第 1 步：首先尝试在 safe-mode 中运行您的 Firefox 客户端。你的问题现在可能已经解决了。如果是这种情况，请继续执行步骤 2。否则...好吧，我建议您更新图形驱动程序或安装更新版本。

第 2 步：禁用您的 Hardware Acceleration(AH)。

在此处查看有关此问题的另一个答案：https://support.mozilla.org/nl/questions/860902

---

现在，如果您只想解决问题，甚至让最古老的 Firefox 浏览器支持这一点。你可以在这里找到一个：Tooltips (title="...") won't show in Firefox

---

希望这能解决你的问题。