悬停图像时是否可以隐藏标题

Is it possible to hide title when hovering image?

本文关键字：隐藏 标题 是否 图像 悬停      更新时间：2023-09-26

这是我的代码：

<img src="image.jpg" alt="" title="some title" />

当我悬停在该图像上时，会出现"一些标题"。有可能被隐藏吗？

正如一些答案指出的那样，这很容易完成，但是知道你想用标题做什么，我会使用 data-* 自定义属性或用 .data（） 附加标题

<img src="image.jpg" alt="" data-title="some title" />

或

$('img').data('title', 'some title');

如果只是悬停的问题，您可以在图像上进行pointer-events: none;，它将解决问题。

删除 title 属性很简单，但"隐藏它"是不可能的（据我所知）; 为了删除标题，以下内容应该可以工作，尽管目前未经测试：

$('img').hover(
    function(){
        $(this).data('originalTitle',$(this).title());
        $(this).removeAttr('title');
    },
    function(){
        $(this).attr('title',$(this).data('originalTitle');
    });

在上面，我选择移动属性，然后在鼠标退出时替换它。

要永久删除title，请执行以下操作：

$('img').removeAttr('title');

引用：

  • attr() .
  • data() .
  • hover() .
  • removeAttr() .

您可以将其移动到图像数据...然后回来。诸如此类

$('img').hover(
  function () {
    $(this).data('title',$(this).attr('title')).removeAttr('title');
  }, 
  function () {
    $(this).attr('title',$(this).data('title'));
  }
);

是的！使用 jQuery，您可以在鼠标悬停时将其删除，然后在鼠标输出时再次添加 - 

$(function(){
  var ttext;
  $('img').hover(function(){
    ttext = $(this).attr('title');
    $(this).removeAttr('title');
  },
  function(){
    $(this).attr('title', ttext);
  });
});

不，不是真的。但是你可以用JavaScript替换它，或者把它留空。

j查询示例：

$('[title]').removeAttr('title');
有点

搞笑的是，在Stack Overflow上，五个人可以同时给出相同的答案:P 

$(function(){
    $('img').hover(function(){
        $(this).removeAttr('title');
    }, function(){
        $(this).attr('title','some title');
    });
});

我至少在Chrome上尝试并使用jQuery/jQuery UI的东西：

  1. 创建您希望（和不希望）具有标题的对象。
  2. 所有这些项存在后，添加工具提示。
  3. 浏览您不希望工具提示以通常方式显示的所有项目，并将工具提示设置为 '' 。

我的代码中的示例，发生在命名的HTML元素可用之后：

jQuery(document).tooltip();
for(var index = 0; index < sites.length; ++index) {
    jQuery('#' + sites[index][0]).attr('title', '');
}
相关文章：