javascript 悬停图像时是否可以隐藏标题？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11257668/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it possible to hide title when hovering image?
提问by Atadj
This is my code:
这是我的代码：
<img src="image.jpg" alt="" title="some title" />
When I hover that image "some title" appears. Is it possible to be hidden?
当我悬停该图像时，会出现“某个标题”。有没有可能被隐藏？
回答by davids
It can be easily done as some answers point out, but knowing what you want to do with title, I would use a data-* custom attribute or attach the title with .data()
正如某些答案所指出的那样，这很容易完成，但是知道您想对标题做什么，我会使用 data-* 自定义属性或使用 .data() 附加标题
<img src="image.jpg" alt="" data-title="some title" />
or
或者
$('img').data('title', 'some title');
回答by David says reinstate Monica
It's simple enough to remove the titleattribute, but 'hiding it' is not possible (so far as I'm aware); in order to remove the title the following should work, though currently untested:
删除title属性很简单，但是“隐藏它”是不可能的（据我所知）；为了删除标题，以下应该有效，但目前尚未测试：
$('img').hover(
function(){
$(this).data('originalTitle',$(this).title());
$(this).removeAttr('title');
},
function(){
$(this).attr('title',$(this).data('originalTitle');
});
In the above I've chosen to move the attribute, and then replace it on mouse-out.
在上面我选择移动属性，然后在鼠标移开时替换它。
To remove the titlepermanently:
要title永久删除：
$('img').removeAttr('title');
References:
参考：
回答by Sergei Zahharenko
You can move it to image data... and back. Like that
您可以将其移动到图像数据...然后返回。像那样
$('img').hover(
function () {
$(this).data('title',$(this).attr('title')).removeAttr('title');
},
function () {
$(this).attr('title',$(this).data('title'));
}
);
回答by Dipak
Yes! with jQuery you can remove it on mouseover and add it again onmouseout -
是的！使用 jQuery，您可以在鼠标悬停时将其删除并在鼠标悬停时再次添加 -
$(function(){
var ttext;
$('img').hover(function(){
ttext = $(this).attr('title');
$(this).removeAttr('title');
},
function(){
$(this).attr('title', ttext);
});
});
回答by Glance
If it's just a question of hover, you can make pointer-events: none;on image, and it will fix the issue.
如果只是悬停的问题，您可以pointer-events: none;在图像上制作，它将解决问题。
回答by Simone
No, not really. But you could replace it with JavaScript, or just leave it blank.
不，不是真的。但是你可以用 JavaScript 替换它，或者把它留空。
jQuery example:
jQuery 示例：
$('[title]').removeAttr('title');
回答by Jezen Thomas
Kind of hilarious that on Stack Overflow, five people can give the same answer at the same time :P
有点搞笑的是，在 Stack Overflow 上，五个人可以同时给出相同的答案：P
$(function(){
$('img').hover(function(){
$(this).removeAttr('title');
}, function(){
$(this).attr('title','some title');
});
});
回答by Christos Hayward
Something I tried and worked with jQuery / jQuery UI on Chrome at least:
我至少在 Chrome 上尝试并使用 jQuery / jQuery UI 进行了一些工作：
- Create the object you want (and don't want) to have a title.
- Once all these items exist, add a tooltip.
- Go through all items you don't want the tooltip displaying the usual way, and set the tooltip to
''.
- 创建您想要（和不想要）拥有标题的对象。
- 一旦所有这些项目都存在，添加一个工具提示。
- 浏览您不希望工具提示以通常方式显示的所有项目，并将工具提示设置为
''。
Example from my code, occuring after named HTML elements are available:
我的代码中的示例，发生在命名的 HTML 元素可用之后：
jQuery(document).tooltip();
for(var index = 0; index < sites.length; ++index) {
jQuery('#' + sites[index][0]).attr('title', '');
}
