Html 是否可以从带有 CSS 的链接中隐藏标题？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15364063/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it possible to hide the title from a link with CSS?
提问by jtepe
I have an anchor element with a title attribute. I want to hide the popup that appears when hovering over it in the browser window. In my case, it is not possible to do something like this,
我有一个带有标题属性的锚元素。我想隐藏在浏览器窗口中将鼠标悬停在它上面时出现的弹出窗口。就我而言，不可能做这样的事情，
$("a").attr("title", "");
Because of jQuery Mobile the title will reappear after certain events occur (basically everytime the anchor element gets redrawn). So I hope to hide the title via CSS.
由于 jQuery Mobile，标题将在某些事件发生后重新出现（基本上每次重绘锚元素时）。所以我希望通过 CSS 隐藏标题。
Something like:
就像是：
a[title] {
display : none;
}
doesn't work, since it hides the entire anchor element. I want to hide the title only. Is this even possible? The popup shouldn't display.
不起作用，因为它隐藏了整个锚元素。我只想隐藏标题。这甚至可能吗？不应显示弹出窗口。
回答by Blake Frederick
Using the following CSS property will ensure that the title attribute text does not appear upon hover:
使用以下 CSS 属性将确保标题属性文本不会在悬停时出现：
pointer-events: none;
Keep in mind that JS is a better solution since this CSS property will ensure that the element is never the target of any mouse events.
请记住，JS 是更好的解决方案，因为此 CSS 属性将确保元素永远不会成为任何鼠标事件的目标。
回答by Todd
As per @boltClock's suggestion, I'll say I don't feel that a CSS solution is appropriate here, as the browser decides what to do with the title attribute of a link, or anything for that matter. CSS, to my knowledge, is unable to handle this issue.
根据@boltClock 的建议，我会说我觉得 CSS 解决方案不适合这里，因为浏览器决定如何处理链接的标题属性，或任何与此相关的事情。据我所知，CSS 无法处理这个问题。
As mentioned, using jQuery to replace the title with an empty string wont work because jQuery mobile rewrites them at some points. This, however, will work independently of JQM, and doesn't involve entirely removing the title attribute which is SEO important.
如前所述，使用 jQuery 将标题替换为空字符串是行不通的，因为 jQuery mobile 在某些时候会重写它们。但是，这将独立于 JQM 工作，并且不涉及完全删除对 SEO 很重要的标题属性。
This works:
这有效：
$('a["title"]').on('mouseenter', function(e){
e.preventDefault();
});
I changed my initial code of $('body').on('mouseenter')to this after testing. This is confirmed to work.
$('body').on('mouseenter')测试后我将我的初始代码更改为这个。这被证实有效。
回答by Arjan Frans
You can wrap your inner text in a span and give that an empty title attribute.
您可以将内部文本包装在一个跨度中，并为其提供一个空的标题属性。
<a href="" title="Something" class=".some-tooltip-class"><span title="">Your text</span></a>
回答by g.annunziata
In CSS it's not possible, because you can only add contents to DOM (tipically with :before :afterand content: '...';, not remove or change attributes.
在 CSS 中这是不可能的，因为您只能向 DOM 添加内容（通常使用:before :afterand content: '...';，而不是删除或更改属性。
The only way is to create a live custom event (es. "change-something"):
唯一的方法是创建一个实时自定义事件（es. "change-something"）：
$("a").on("change-something", function(event) { this.removeAttr("title"); });
$("a").on("change-something", function(event) { this.removeAttr("title"); });
and trigger to every changes:
并触发每个更改：
... $("a").trigger("change-something");
... $("a").trigger("change-something");
More information and demo here:
更多信息和演示在这里：
http://api.jquery.com/trigger/
http://api.jquery.com/removeAttr/
http://api.jquery.com/trigger/
http://api.jquery.com/removeAttr/
回答by mustafa-elhelbawy
try to change your code using this
尝试使用此更改您的代码
$(document).ready(function() {
$("a").removeAttr("title");
});
this will remove title attribute so the hint label won't be appear when hover on the link
这将删除标题属性，因此当悬停在链接上时不会出现提示标签
