Question

我已经查看过以前的问题而且没有一个真的对我有效，我已经检查了谷歌，我发现的信息看起来很模糊，所以我想我会在这里试试。

是否有人知道/或已经解决了悬停时显示标题标签的问题。我有一系列链接和图像将分配标题标签，但是，其中一些将显示最好不要在悬停时弹出的信息。

我是否可以使用全局函数将其应用于所有标题标签？一个例子如下：

<a href="service.php" title="services for cars" />

如果可能，我想禁用悬停时出现的“汽车服务”标题。

再次感谢。

Answer 1

这应该可以正常禁用单个标题：

<a href="service.php" title="services for cars" onmouseover="this.title='';" />

如果您之后需要标题，可以将其恢复：

<a href="service.php" title="services for cars" onmouseover="this.setAttribute('org_title', this.title'); this.title='';" onmouseout="this.title = this.getAttribute('org_title');" />

这种方式不是通用的..要将它应用于所有锚点，有这样的JavaScript代码：

window.onload = function() {
    var links = document.getElementsByTagName("a");
    for (var i = 0; i < links.length; i++) {
        var link = links[i];
        link.onmouseover = function() {
            this.setAttribute("org_title", this.title);
            this.title = "";
        };
        link.onmouseout = function() {
            this.title = this.getAttribute("org_title");
        };
    }
};

Live test case

编辑：将更多标签应用于更多标签（例如<img>）首先将代码的核心移动到一个函数：

function DisableToolTip(elements) {
    for (var i = 0; i < elements.length; i++) {
        var element = elements[i];
        element.onmouseover = function() {
            this.setAttribute("org_title", this.title);
            this.title = "";
        };
        element.onmouseout = function() {
            this.title = this.getAttribute("org_title");
        };
    }
}

然后将代码更改为：

window.onload = function() {
    var links = document.getElementsByTagName("a");
    DisableToolTip(links);
    var images = document.getElementsByTagName("img");
    DisableToolTip(images);
};

Answer 2

如果您使用＆＃39;标题＆＃39;标签适用于Aria合规，请改用aria-label。

<a href="service.php" aria-label="services for cars" />

Answer 3

尝试设置两个标题，一个空标题，将被浏览器选为工具提示，然后是您需要的标题：

    <a href="service.php" title="" title="services for cars" />

Answer 4

您无法禁用它们，因为它是browser / html规范的通用部分。但是我知道你可以使用css和javascript来设置它们的样式，所以显示：none应该可以在某个地方使用。

看here

Answer 5

虽然这已在标准JS中得到解答。

这是一个jQuery解决方案。

$('a').hover( 
  function() {
        $(this).attr("org_title", $(this).attr('title'));
        $(this).attr('title', '');
  }, function() {
        $(this).attr('title', $(this).attr("org_title"));
  }
);

Answer 6

一个简单的替代方法是在图像的容器上使用CSS（div或a）：

pointer-events: none;
cursor: default;

在悬停时隐藏标题标签

6 个答案: