抑制链接标题答案

【问题标题】：Suppress Link Titles抑制链接标题
【发布时间】：2009-05-01 00:56:22
【问题描述】：

有什么方法可以抑制链接上的弹出标题，但仍将它们保留在页面上以供视障人士使用？

【问题讨论】：

标签： html hyperlink title

【解决方案1】：

这是浏览器解释链接标题并显示工具提示/弹出窗口的功能。没有办法压制他们。我试过了（因为客户也不喜欢它们）但没有办法绕过它们。

【讨论】：

Firefox 没有任何链接工具提示，除非它们声明了标题属性。
问题不是在问如何在隐藏工具提示的同时保留标题属性吗？我不知道有任何浏览器在没有标题属性的链接上显示工具提示。工具提示会说什么？
可能工具提示可能是链接的 URL。
我认为这在 Opera >9.x 中是正确的（最后尝试）@ Ben S.
这在 Opera 9.64（最新版本）中不起作用。 URL 只显示在状态栏中，就像在 FF3 和 IE 中一样。如果您将 URL 视为工具提示，那是因为该链接将 URL 作为其标题属性。

【解决方案2】：

我知道这已经解决，但我也找到了这个解决方法：Hide native tooltip using jQuery

【讨论】：

可以避免只链接答案。
cmets 也可以使用 5 年的答案。

【解决方案3】：

我在一个项目中遇到了这个问题，客户想要显示他们自己的工具提示（使用 CSS 完成），但由于浏览器启动的工具提示也显示了，所以它显示了两次。我们通过删除 'title' 属性并使用 'data' 来填充 CSS 中的文本来解决这个问题。

我不确定您将它们保留在视障人士的页面上是什么意思，因为它们仅在源代码中可见？

例如：

<a href="link" title="something">Link title here</a>

会在页面上显示链接“此处的链接标题”以及当您将鼠标悬停在该链接上时令人讨厌的弹出窗口。

<a href="link" data="something">Link title here</a>

将显示链接“此处的链接标题”，但不会在悬停时显示烦人的弹出窗口，尽管您仍然可以使用 data 标记来引用您想要放在那里的任何内容（在我们的例子中，我们将文本放在CSS 参考的工具提示）。

显然，如果您完全删除标题标签，问题就解决了，但您说您需要保留它，所以这是我以前使用的解决方法。

【讨论】：

【解决方案4】：

这适用于 jQuery。

var val;
$('[YOUR_SELECTOR]').hover(function() {
    val = $(this).attr('title');
    $(this).removeAttr('title');
  },function() {
    $(this).attr('title',val);
})

【讨论】：

【解决方案5】：

...这可能并不理想，但您总是可以尝试在<a href> 中使用<span> 来代替title 属性<a> 标签：

/* screen.css */

a   { }

a span.titleText {
    display: none;
    position: absolute;
    bottom: 1.2em;
    left: 0;
}

a:hover span.titleText,
a:active span.titleText,
a:focus span.titleText {
    display: block;
}

/* audio.css */

a span {
    display: inline; /* or whatever the relevant attribute would 
                        be in an audio stylesheet. */
}

<head>
    <link href="screen.css" type="text/css" rel="stylesheet" media="screen" />
    <link href="audio.css" type="text/css" rel="stylesheet" media="screen-reader, audio" />
</head>

<a href="http://some.url.com">
    <span class="titleText">This is the title</span>This is the link
</a>

但是，我不建议将其作为特别实用的解决方案。而且我相当肯定它不会验证。如果我知道 JS，我会建议一些更可行的方法，但即便如此我也不相信它会起作用。

【讨论】：

【解决方案6】：

我的浏览器中的链接不会显示类似的工具提示，除非它们具有 title 属性。

如果你愿意，你可以使用Greasemonkey 在每个页面上运行这段 javascript 来删除它们。

var anchorTags;
anchorTags = document.getElementsByTagName("a");
for(var i = 0; i < anchorTags.length; i++) {
  anchorTags[i].removeAttribute("title");
}

【讨论】：

我得到的印象是他试图在他自己/工作/公司网站上为其他人删除它们，而不是因为他们的存在而个人受到冒犯。我不明白为什么，请注意；这只是我的初步印象。
好吧，在这种情况下，请避免将标题属性放在锚点上。
我倾向于同意这个建议，尽管它确实使可访问性方面的事情变得复杂，也许。