禁用链接和<abbr>上的浏览器工具提示

rob*_*rke 11 javascript jquery microformats accessibility

当用户将鼠标悬停在某些链接和元素上时,我想要禁止Web浏览器的默认工具提示显示.我知道这是可能的,但我不知道如何.有人可以帮忙吗?

这样做的原因是抑制微格式日期时间的工具提示.BBC放弃了对hCalendar的支持,因为机器可读日期的外观对于有认知障碍的人以及一些屏幕阅读器用户来说是一个可访问性问题.http://www.bbc.co.uk/blogs/bbcinternet/2008/07/why_the_bbc_removed_microforma.html

编辑:

我按照与Aron的建议相同的方式掀起了一个jquery插件......

// uFsuppress plugin v1.0 - toggle microformatted dates
(function($){
$.ufsuppress = function() {
    $(".dtstart,.dtend,.bday").hover(function(){
        $(this).attr("ufdata",$(this).attr("title"));
        $(this).removeAttr("title");
    },function(){
        $(this).attr("title",$(this).attr("ufdata"));
        $(this).removeAttr("ufdata");
    });
}
})(jQuery);

// Usage
$.ufsuppress();
Run Code Online (Sandbox Code Playgroud)

Aro*_*eel 22

据我知道这是不可能真正抑制显示标题标签.

但是有一些解决方法.

假设您想要保留链接和元素的title属性,可以使用Javascript删除title属性onmouseover()并再次设置它onmouseout().

// Suppress tooltip display for links that have the classname 'suppress'
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
    if (links[i].className == 'suppress') {
        links[i]._title = links[i].title;
        links[i].onmouseover = function() { 
            this.title = '';
        }
        links[i].onmouseout = function() { 
            this.title = this._title;
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

  • 在微格式日期的情况下,title属性是机器可读的内容,这意味着它对于某些屏幕阅读器用户来说不太有用甚至令人困惑. (2认同)

Enk*_*ode 8

将此元素添加到您的html中

    onmouseover="title='';"
Run Code Online (Sandbox Code Playgroud)

例如,我有一个asp.net复选框我存储一个隐藏的变量,但不希望用户看到作为工具提示.


Ben*_*Ben 5

使用jQuery插件timeago时,请浏览此线程.实际上使用CSS属性解决方案非常简单pointer-events.发布此信息是为了通过搜索引擎来到这里的人们的利益:)

.suppress {
    pointer-events:none;
}
Run Code Online (Sandbox Code Playgroud)

请注意,您不应该将此用于应该点击某些内容的链接.在这种情况下,使用接受的JS解决方案.