jquery：隐藏标题属性但不删除它
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3885920/
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
jquery: hide title attribute but not remove it
提问by laukok
I have seen that most people will do it with this solution that on mouse over, we will grab the value in the TITLE attribute, then, remove its value. While on mouse out, we'll put it back on.
我已经看到大多数人会用这个解决方案来做到这一点，在鼠标悬停时，我们将获取 TITLE 属性中的值，然后删除它的值。当鼠标消失时，我们将把它放回去。
$(this).attr('title','');
or
或者
$(this).removeAttr('title');
I want to know is it possible just hide the tooltip from appearing than removing the title attribute?
我想知道是否可以只隐藏工具提示而不是删除标题属性？
thanks!
谢谢！
回答by FRotthowe
No you can't, as the browser will decide what to do with the title attribute. You can, however, save it with the node for later reference (and possibly restoring the title):
不，你不能，因为浏览器将决定如何处理 title 属性。但是，您可以将其与节点一起保存以供以后参考（并可能恢复标题）：
$(this).data("title", $(this).attr("title")).removeAttr("title");
回答by Ridwan Pujakesuma
This works.
这有效。
$(document).ready(function(){
$( "a" )
.mouseenter(function() {
var title = $(this).attr("title");
$(this).attr("tmp_title", title);
$(this).attr("title","");
})
.mouseleave(function() {
var title = $(this).attr("tmp_title");
$(this).attr("title", title);
})
.click(function() {
var title = $(this).attr("tmp_title");
$(this).attr("title", title);
});
});
});回答by Dan Davies Brackett
You can store the title somewhere else while the mouse is over the element. You don't have to store it in the DOM itself, though; you could keep it in a JS var:
当鼠标悬停在元素上时，您可以将标题存储在其他地方。不过，您不必将它存储在 DOM 本身中；你可以把它保存在一个 JS 变量中：
(function(){
var ttext;
$(yourtargetselectorhere).hover(function(){
ttext = $(this).attr('title');
$(this).removeAttr('title');
},
function(){
$(this).attr('title', ttext);
});
}());
回答by Akin G.
thanks for your solution. I had same problem in a project. The issue was a long ugly title was appearing when I hover the image and I needed the title in popup because in title attribute, I place a buy link to a product. but as I said, a long title which includes tag was appearing on hover too. so I just added a .click function to the end of your solution, I don't know if it's possible to solve this in a more semantic way, since i'm not a jquery expert. the complete script is pasted below, regards :)
感谢您的解决方案。我在一个项目中遇到了同样的问题。问题是当我悬停图像时出现了一个长而难看的标题，我需要在弹出窗口中显示标题，因为在标题属性中，我放置了一个产品的购买链接。但正如我所说，包含标签的长标题也出现在悬停时。所以我只是在你的解决方案的末尾添加了一个 .click 函数，我不知道是否有可能以更语义化的方式解决这个问题，因为我不是 jquery 专家。完整的脚本粘贴在下面，问候:)
$(".collection-box a").hover(function(){
// Get the current title
var title = $(this).attr("title");
// Store it in a temporary attribute
$(this).attr("tmp_title", title);
// Set the title to nothing so we don't see the tooltips
$(this).attr("title","");
},
function() { // Fired when we leave the element
// Retrieve the title from the temporary attribute
var title = $(this).attr("tmp_title");
// Return the title to what it was
$(this).attr("title", title);
});
//Restore the title on click
$(".collection-box a").click(function(){
// Retrieve the title from the temporary attribute
var title = $(this).attr("tmp_title");
// Return the title to what it was
$(this).attr("title", title);
});
回答by George Mandis
Afraid you can't. The preventDefault()method doesn't seem to work for this, which is unfortunate because it would be ideal.
怕你做不到。该preventDefault()方法似乎对此不起作用，这是不幸的，因为它是理想的。
If you really need to retain the title attribute you could do something like this:
如果你真的需要保留 title 属性，你可以这样做：
$(document).ready(function(){
$("a").hover(function(){
// Get the current title
var title = $(this).attr("title");
// Store it in a temporary attribute
$(this).attr("tmp_title", title);
// Set the title to nothing so we don't see the tooltips
$(this).attr("title","");
},
function() { // Fired when we leave the element
// Retrieve the title from the temporary attribute
var title = $(this).attr("tmp_title");
// Return the title to what it was
$(this).attr("title", title);
});
});
It's pretty convoluted though. Unless there's a specific reason you need to retain the title attributes, I would just remove them.
不过还是挺纠结的。除非有特殊原因需要保留标题属性，否则我会删除它们。
回答by Ravi Sharma
Here is a good solution, name a new attribute say 'fancytitle' in place of the usual 'title' like this
这是一个很好的解决方案，命名一个新属性，例如“fancytitle”代替通常的“title”
<a href='#' customtitle='visit google' id='demo'> Visit Google Search </a>
And pick attribute's value with jquery on mouseenter/hover like this
并像这样在 mouseenter/hover 上使用 jquery 选择属性的值
$('a#demo').attr('fancytitle')
