当前位置:  开发笔记 > 编程语言 > 正文

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

如何解决《禁用链接和<abbr>上的浏览器工具提示》经验,为你挑选了3个好方法。

当用户将鼠标悬停在某些链接和元素上时,我想要禁止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();

Aron Rotteve.. 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;
        }
    }
}

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


Enkode.. 8

将此元素添加到您的html中

    onmouseover="title='';"

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



1> Aron Rotteve..:

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

但是有一些解决方法.

假设您想要保留链接和元素的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;
        }
    }
}


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

2> Enkode..:

将此元素添加到您的html中

    onmouseover="title='';"

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



3> Ben..:

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

.suppress {
    pointer-events:none;
}

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

推荐阅读
TXCWB_523
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有