我有一个带有title属性的anchor元素。我想隐藏在浏览器窗口中悬停在它上面时出现的弹出窗口。在我的情况下,不可能做这样的事情,
$("a").attr("title", "");
由于jQueryMobile的原因,标题会在某些事件发生后重新出现(基本上每次锚元素被重绘时),所以我希望通过CSS隐藏标题。比如:
a[title] { display : none; }
不起作用,因为它隐藏了整个锚元素。我只想隐藏标题。这可能吗?弹出窗口不应该显示。
ugmeyewa1#
使用以下CSS属性将确保鼠标悬停时不会显示title属性文本:
pointer-events: none;
请记住,JS是一个更好的解决方案,因为这个CSS属性将确保元素永远不会成为任何鼠标事件的目标。
wmtdaxz32#
您可以将内部文本 Package 在span中,并给予它一个空的title属性。
<a href="" title="Something"> <span title="">Your text</span> </a>
mkshixfv3#
根据@boltClock的建议,我会说我觉得CSS解决方案在这里不合适,因为浏览器决定如何处理链接的title属性,或者任何相关的事情。据我所知,CSS无法处理这个问题。如前所述,使用jQuery将title替换为空字符串是行不通的,因为jQuery mobile会在某些时候重写它们。然而,这将独立于JQM工作,并且不涉及完全删除title属性,这是SEO的重要内容。这是可行的:
$('a["title"]').on('mouseenter', function(e){ e.preventDefault(); });
$('body').on('mouseenter')
p5fdfcr14#
在CSS中,这是不可能的,因为你只能向DOM添加内容(通常是:before :after和content: '...';,不能删除或更改属性)。唯一的方法是创建实时自定义事件(例如"change-something"):$("a").on("change-something", function(event) { this.removeAttr("title"); });并触发每一个变化:... $("a").trigger("change-something");更多信息和演示:http://api.jquery.com/trigger/http://api.jquery.com/removeAttr/
:before :after
content: '...';
"change-something"
$("a").on("change-something", function(event) { this.removeAttr("title"); });
... $("a").trigger("change-something");
lf5gs5x25#
尝试使用此更改代码
$(document).ready(function() { $("a").removeAttr("title"); });
这将删除标题属性,因此当鼠标悬停在链接上时,提示标签不会出现
siv3szwd6#
$("#test").tooltip({title: false});
title属性的默认值为true,请将其设置为false。这仅在引导工具提示的情况下有效
title
true
false
ubbxdtey7#
完整的纯javascript解决方案
var anchors = document.querySelectorAll('a[title]'); for (let i = anchors.length - 1; i >= 0; i--) { anchors[i].addEventListener('mouseenter', function(e){ anchors[i].setAttribute('data-title', anchors[i].title); anchors[i].removeAttribute('title'); }); anchors[i].addEventListener('mouseleave', function(e){ anchors[i].title = anchors[i].getAttribute('data-title'); anchors[i].removeAttribute('data-title'); }); }
7条答案
按热度按时间ugmeyewa1#
使用以下CSS属性将确保鼠标悬停时不会显示title属性文本:
请记住,JS是一个更好的解决方案,因为这个CSS属性将确保元素永远不会成为任何鼠标事件的目标。
wmtdaxz32#
您可以将内部文本 Package 在span中,并给予它一个空的title属性。
mkshixfv3#
根据@boltClock的建议,我会说我觉得CSS解决方案在这里不合适,因为浏览器决定如何处理链接的title属性,或者任何相关的事情。据我所知,CSS无法处理这个问题。
如前所述,使用jQuery将title替换为空字符串是行不通的,因为jQuery mobile会在某些时候重写它们。然而,这将独立于JQM工作,并且不涉及完全删除title属性,这是SEO的重要内容。
这是可行的:
$('body').on('mouseenter')
更改为这个。这被确认工作。*p5fdfcr14#
在CSS中,这是不可能的,因为你只能向DOM添加内容(通常是
:before :after
和content: '...';
,不能删除或更改属性)。唯一的方法是创建实时自定义事件(例如
"change-something"
):$("a").on("change-something", function(event) { this.removeAttr("title"); });
并触发每一个变化:
... $("a").trigger("change-something");
更多信息和演示:
http://api.jquery.com/trigger/
http://api.jquery.com/removeAttr/
lf5gs5x25#
尝试使用此更改代码
这将删除标题属性,因此当鼠标悬停在链接上时,提示标签不会出现
siv3szwd6#
title
属性的默认值为true
,请将其设置为false
。这仅在引导工具提示的情况下有效ubbxdtey7#
完整的纯javascript解决方案